本文介紹了用Docker搭建Laravel和Vue項(xiàng)目的開(kāi)發(fā)環(huán)境,分享給大家,具體如下:

在這篇文章中我們將通過(guò)Docker在個(gè)人本地電腦上構(gòu)建一個(gè)快速、輕量級(jí)、不依賴本地電腦所安裝的任何開(kāi)發(fā)套件的可復(fù)制的Laravel和Vue項(xiàng)目的開(kāi)發(fā)環(huán)境(開(kāi)發(fā)環(huán)境的所有依賴都安裝在Docker構(gòu)建容器里),加入Vue只是因?yàn)橛械捻?xiàng)目里會(huì)在Laravel項(xiàng)目中使用Vue做前后端分離開(kāi)發(fā),開(kāi)發(fā)環(huán)境中需要安裝前端開(kāi)發(fā)需要的工具集,當(dāng)然前后端也可以分成兩個(gè)項(xiàng)目開(kāi)發(fā),這個(gè)話題不在本篇文章的討論范圍內(nèi)。
所以我們的目標(biāo)是:
- 不在本地安裝Mamp/Wamp這樣的軟件
- 不使用類(lèi)似Vagrant這樣的虛擬機(jī)
- 不在本地電腦全局安裝PHP開(kāi)發(fā)所需要的工具集
- 不在本地電腦全局安裝前端開(kāi)發(fā)所需要的工具集
- 不在本地電腦全局安裝Mysql和Nginx
開(kāi)始前你需要先去安裝一個(gè)Docker客戶端,Docker的官網(wǎng)中有詳細(xì)的安裝方法。
第一步:獲取Laravel的源碼包
因?yàn)槲覀冸娔X上不安裝Composer,所以就不能使用Composer來(lái)創(chuàng)建Laravel項(xiàng)目了, 這里我使用cURL直接從github上下載了最新的Laravel源碼包,你也可以使用wget或者git clone 來(lái)獲取源碼包。
curl -L -O https://github.com/laravel/laravel/archive/v5.5.0.tar.gz /
&& tar -zxvf v5.5.0.tar.gz /
&& rm v5.5.0.tar.gz
上面的命令在curl下載完源碼包后會(huì)解壓源碼壓縮包,解壓完成后在把源碼壓縮包v5.5.0.tar.gz
刪掉,執(zhí)行完后你會(huì)看到一個(gè)laravel-5.5.0的項(xiàng)目目錄。
第二步:添加docker-compose.yml
在項(xiàng)目中創(chuàng)建docker-compose.yml
文件。
Compose
項(xiàng)目是 Docker 官方的開(kāi)源項(xiàng)目,負(fù)責(zé)實(shí)現(xiàn)對(duì) Docker 容器集群的快速編排。我們知道使用一個(gè) Dockerfile
模板文件,可以讓用戶很方便的定義一個(gè)單獨(dú)的應(yīng)用容器。在這里我們會(huì)用到四個(gè)容器分別將PHP
、Mysql、
Nginx放在四個(gè)不同的容器中,通過(guò)
compose`將四個(gè)應(yīng)用容器關(guān)聯(lián)到一起組成項(xiàng)目。
編排文件的開(kāi)頭如下:
version: '2'
services:
# our services will go here
在編排文件中,把每個(gè)容器叫做一個(gè)服務(wù),services下定義整個(gè)應(yīng)用中用到的所有服務(wù)(即容器)。
App服務(wù)
APP服務(wù)的容器將執(zhí)行我們項(xiàng)目中的代碼。
app:
build:
context: ./
dockerfile: app.dockerfile
working_dir: /var/www
volumes:
- ./:/var/www
environment:
- "DB_PORT=3306"
- "DB_HOST=database"
Notes:
- 我們使用
app.dockerfile
這個(gè)鏡像文件來(lái)構(gòu)建我們的App容器,在鏡像文件中我們會(huì)對(duì)項(xiàng)目中用到的PHP模塊鏡像配置,也會(huì)額外安裝NPM用來(lái)構(gòu)建前端代碼。
working_dir: /var/www
把工作目錄設(shè)置成了/var/www
,在容器中項(xiàng)目代碼將會(huì)被放在/var/www
目錄下面,包括使用docker exec app
執(zhí)行的命令也都是以/var/www
為當(dāng)前工作目錄的。
volumes
是容器內(nèi)數(shù)據(jù)卷所掛載路徑設(shè)置,在這里我們只定義一個(gè)數(shù)據(jù)卷,把宿主機(jī)項(xiàng)目目錄掛到在容器中的/var/www
上,這樣我們?cè)诒镜仉娔X對(duì)項(xiàng)目代碼進(jìn)行的更改就會(huì)馬上同步到容器中去,反過(guò)來(lái)也是一樣,容器中對(duì)代碼做的更改也會(huì)及時(shí)反饋到本地電腦的項(xiàng)目中。
environment
設(shè)置環(huán)境變量名,這里我們?cè)O(shè)置了DB_PORT
和DB_HOST
這樣就不用修改項(xiàng)目中的.env
文件里關(guān)于這兩項(xiàng)的值了,當(dāng)然任何你需要在開(kāi)發(fā)環(huán)境單獨(dú)設(shè)置的環(huán)境變量都可以寫(xiě)到這里,Laravel讀取配置使用的DotEnv
會(huì)檢測(cè)是否系統(tǒng)有指定環(huán)境變量的設(shè)置,有的話就不會(huì)在去讀取.env
文件了。
現(xiàn)在我們需要?jiǎng)?chuàng)建上面build環(huán)節(jié)中提到的app.dockerfile
這個(gè)文件了,具體內(nèi)容如下:
FROM php:7.1.22-fpm
# Update packages
RUN apt-get update
# Install PHP and composer dependencies
RUN apt-get install -qq git curl libmcrypt-dev libjpeg-dev libpng-dev libfreetype6-dev libbz2-dev
# Clear out the local repository of retrieved package files
# RUN apt-get clean
# Install needed extensions
# Here you can install any other extension that you need during the test and deployment process
RUN apt-get clean; docker-php-ext-install pdo pdo_mysql mcrypt zip gd pcntl opcache bcmath
# Installs Composer to easily manage your PHP dependencies.
RUN curl --silent --show-error https://getcomposer.org/installer | php -- --install-dir=/usr/local/bin --filename=composer
# Install Node
RUN apt-get update &&\
apt-get install -y --no-install-recommends gnupg &&\
curl -sL https://deb.nodesource.com/setup_10.x | bash - &&\
apt-get update &&\
apt-get install -y --no-install-recommends nodejs &&\
npm config set registry https://registry.npm.taobao.org --global &&\
npm install --global gulp-cli
CMD php-fpm
Notes:
我在這里先將NPM和Composer裝到了app容器中,因?yàn)樵陂_(kāi)發(fā)時(shí)經(jīng)常需要執(zhí)行他們,如果發(fā)布到生產(chǎn)環(huán)境,一般是使用單獨(dú)的composer對(duì)項(xiàng)目代碼進(jìn)行構(gòu)建而不是放在運(yùn)行應(yīng)用的容器里,容器的核心思想之一就是保持單一,這樣才能做到快速增加相同角色的容器。
Web服務(wù)
接下來(lái),我們需要配置一個(gè)Web服務(wù)器用,我們把這個(gè)容器在編排文件中命名成web
web:
build:
context: ./
dockerfile: web.dockerfile
working_dir: /var/www
volumes_from:
- app
ports:
- 8080:80
Notes:
volumes_from
用來(lái)復(fù)用在app
服務(wù)中定義的數(shù)據(jù)卷路徑
- 通過(guò)
ports
將本地電腦的8080端口映射到web容器的80端口,這樣在開(kāi)發(fā)環(huán)境中我們就不用設(shè)置hosts文件,直接通過(guò)IP加端口就能訪問(wèn)服務(wù)了。
Web服務(wù)器選用nginx,所以我們需要用一個(gè)nginx鏡像文件來(lái)構(gòu)建這個(gè)容器,在這之前我們需要在nginx鏡像的基礎(chǔ)上再設(shè)置一下項(xiàng)目中用到的vhost
,所以我們需要一個(gè)web.dockerfile
文件,它的定義如下:
FROM nginx:1.10
ADD vhost.conf /etc/nginx/conf.d/default.conf
根據(jù)鏡像文件的定義,我們把項(xiàng)目中的vhost.conf
復(fù)制到了容器的/etc/nginx/conf.d/default.conf
中,這樣基本的nginx配置就配置好了,vhost.conf
中的定義如下:
server {
listen 80;
index index.php index.html;
root /var/www/public;
location / {
try_files $uri /index.php?$args;
}
location ~ \.php$ {
fastcgi_split_path_info ^(.+\.php)(/.+)$;
fastcgi_pass app:9000;
fastcgi_index index.php;
include fastcgi_params;
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
fastcgi_param PATH_INFO $fastcgi_path_info;
}
}
Notes:
- 因?yàn)槭情_(kāi)發(fā)環(huán)境我們就只進(jìn)行最簡(jiǎn)單的配置,不做調(diào)優(yōu)考慮了。
fastcgi_pass app:9000;
nginx將對(duì)PHP的請(qǐng)求通過(guò)fastcgi傳遞給了app
服務(wù)的9000端口,docker-compose
會(huì)自動(dòng)把services中定義的容器服務(wù)連接起來(lái),各個(gè)服務(wù)相互之間使用服務(wù)名稱(chēng)引用。
Mysql服務(wù)
接下來(lái)我們將配置Mysql服務(wù),與上面兩個(gè)服務(wù)有點(diǎn)不一樣的是,在PHP-FPM和Nginx的容器中,我們配置本地電腦的文件可以同步到容器中供容器訪問(wèn),這讓我們開(kāi)發(fā)時(shí)對(duì)文件作的更改能夠快速的在容器中得到反饋加快我們的開(kāi)發(fā)過(guò)程。但是在數(shù)據(jù)庫(kù)容器中我們希望容器中創(chuàng)建的文件能夠持久化(默認(rèn)容器銷(xiāo)毀時(shí),容器內(nèi)創(chuàng)建的文件也會(huì)被銷(xiāo)毀),我們可以通過(guò)Docker的數(shù)據(jù)卷來(lái)實(shí)現(xiàn)上述功能,只不過(guò)這次不用再把本地電腦的文件掛在到數(shù)據(jù)卷上了,Docker客戶端會(huì)管理創(chuàng)建的數(shù)據(jù)卷的在本地電腦上具體存儲(chǔ)的位置。
下面是編排文件中對(duì)database服務(wù)的設(shè)置
version: '2'
services:
database:
image: mysql:5.7
volumes:
- dbdata:/var/lib/mysql
environment:
- "MYSQL_DATABASE=homestead"
- "MYSQL_USER=homestead"
- "MYSQL_PASSWORD=secret"
- "MYSQL_ROOT_PASSWORD=secret"
ports:
- "33061:3306"
volumes:
dbdata:
Notes:
- 在文件的最下面我們通過(guò)
volumes
命令創(chuàng)建了一個(gè)名為dbdata
的數(shù)據(jù)卷(dbdata后面的冒號(hào)是有意寫(xiě)上去的,這是YML文件的一個(gè)語(yǔ)法限制,不用太關(guān)心)
- 定義完數(shù)據(jù)卷后,在上面我們使用
<name>:<dir>
的格式,通知Docker,將dbdata
數(shù)據(jù)卷掛在到容器中的/var/lib/mysql
目錄上
environments
中設(shè)置的是Mysql的docker鏡像需要的四個(gè)必要參數(shù)。
ports
端口映射中,我們將本地電腦的33061端口映射到容器的3306端口,這樣我們就能通過(guò)電腦上的數(shù)據(jù)庫(kù)工具連接到docker內(nèi)的Mysql了。
將所有服務(wù)編排到一起
下面是完整的docker-compose.yml
文件,通過(guò)編排文件我們將三個(gè)應(yīng)用容器關(guān)聯(lián)在一起組成了項(xiàng)目的服務(wù)端
version: '2'
services:
# The Application
app:
build:
context: ./
dockerfile: app.dockerfile
working_dir: /var/www
volumes:
- ./:/var/www
environment:
- "DB_PORT=3306"
- "DB_HOST=database"
# The Web Server
web:
build:
context: ./
dockerfile: web.dockerfile
working_dir: /var/www
volumes_from:
- app
ports:
- 8080:80
# The Database
database:
image: mysql:5.6
volumes:
- dbdata:/var/lib/mysql
environment:
- "MYSQL_DATABASE=homestead"
- "MYSQL_USER=homestead"
- "MYSQL_PASSWORD=secret"
- "MYSQL_ROOT_PASSWORD=secret"
ports:
- "33061:3306"
volumes:
dbdata:
啟動(dòng)服務(wù)
按照上面的步驟配置好編排文件還有指定的docker鏡像文件后,我們就可以通過(guò)下面的命令啟動(dòng)服務(wù)了,執(zhí)行完后會(huì)啟動(dòng)上面文件里定義的三個(gè)服務(wù)。
第一次啟動(dòng)時(shí),由于docker客戶端要下載上面提到的三個(gè)鏡像并且構(gòu)建服務(wù)所以啟動(dòng)速度會(huì)慢一些,等到下載完鏡像并構(gòu)建完成后,以后的啟動(dòng)都會(huì)非??臁?/p>
初始化Laravel項(xiàng)目
啟動(dòng)完服務(wù)后我們可以初始化Laravel項(xiàng)目了,步驟跟官方文檔里介紹的一樣,但是需要在啟動(dòng)的app服務(wù)的容器里執(zhí)行:
docker-compose exec app composer install
docker-compose exec app npm install // 如果包含前端項(xiàng)目的話再執(zhí)行相關(guān)命令
docker-compose exec app cp .env.example .env
docker-compose exec app php artisan key:generate
docker-compose exec app php artisan optimize
docker-compose exec app php artisan migrate --seed
docker-compose exec app php artisan make:controller MyController
Notes:
- docker-compose exec 將命令發(fā)送到指定的容器中去執(zhí)行
- app是定義在docker-compose.yml中的一個(gè)服務(wù),它是一個(gè)運(yùn)行著php-fpm的容器
- php artisan migrate 是要在容器里執(zhí)行的命令
查看nginx日志的方法:
- docker ps 找到nginx服務(wù)的container id
- docker exec -it <contianer id> /bin/bash 進(jìn)入nginx容器
- nginx日志的具體路徑請(qǐng)查看項(xiàng)目中的vhost.conf
執(zhí)行完上面的命令后你就能通過(guò)http://127.0.0.1:8080/
訪問(wèn)到項(xiàng)目啦。

在我的Github gist有一組參考文件方便同學(xué)們參考https://gist.github.com/kevinyan815/fa0760902d29f19a4213b4a16fe0501b
gist里的文件稍微舊一些,后來(lái)在使用的過(guò)程中又加入些新的PHP模塊和Node,之前composer也單獨(dú)放到了一個(gè)容器中,不過(guò)相信聰明的你看到這里應(yīng)該已經(jīng)會(huì)根據(jù)需求更改這些文件啦。
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。