Mac+DockerでphpStormを使いWordPressテーマを一から作る（2/3）
前回の続きです。
Mac+DockerでphpStormを使いWordPressテーマを一から作る（1/3）
ここまでに以下のステップを踏んできました。
-
- XCodeのインストール(1/3)
-
- Homebrewのインストール(1/3)
- node(npm)+node-sassのインストール(1/3)
那么，我们立刻继续进行下去吧。
ゴール
Docker Desktop for Mac でWordpress環境を作り、スターターテーマのunderscores(_S)を使ったテーマ開発ができるようにする。
cssはSassを使い、phpStorm側でコンパイルが出来るようにする。
ついでにphpMyAdminも使えるようにする。
前提条件
-
- MacOS Catalina(10.15) ※セットアップとデータ移行が済んだ状態
- phpStorm(2020.1)
进行翻译
-
- XCodeのインストール(1/3)
-
- Homebrewのインストール(1/3)
-
- node(npm)+node-sassのインストール(1/3)
-
- Docker Desktop for Mac のインストール（(2/3)
-
- Docker-composeによるコンテナの構築（2/3）
-
- underscores(_s)でのスターターテーマの作成とファイルの設置(3/3)
- phpStormでのSassウォッチャーの登録(3/3)
安装 Docker Desktop for Mac
目前为止，Docker已经安装完成。
使用Docker Compose进行容器构建
安装Docker Desktop后，将自动安装docker-compose的相关组件。
关于Docker-compose，
建议您阅读“樱花的知识”网站上的这篇文章进行详细了解。
使用此docker-compose，只需使用名为”docker-compose.yml”的YAML格式文件来指定容器的内容，一次性地使用一个命令就可以创建符合指定内容的容器。非常便利。
我最初打算在容器中创建nginx或Apache容器以及php和MySQL容器，然后将WordPress部署到php的目录下应该就可以了吧？我打算在这次项目中在 /Users/<用户名>/Documents/ 目录下创建环境。大致如下所示。（※省略了具体的细节）
<dockerコンテナを格納するディレクトリ名>/
+docker-compose.yml
+php/
| +html/
| +wordpress/
+Mysql/
+nginx/
以PHP/HTML为文档根目录，在该目录下安装了从官方下载的最新WordPress版本。
我原本是这样想的，但无论尝试多少次都无法连接到数据库。。
我在查看phpini()时发现没有安装PDO，所以尝试安装了它，但结果并没有改变。
在观察了其他案例后，我发现无论哪个案例都在 Docker-hub 上使用了提供的 WordPress。看来那是正确答案。直到我意识到这一点，已经花了相当一段时间。
最终的目录结构如下。
<dockerコンテナを格納するディレクトリ名>/
+docker-compose.yml
+db/
+www/
+html/
+配下にWorPress関連ファイル一式
并且 docker-compose.yml 文件的内容如下所示。
version: '3.7'
services:
wordpress:
image: wordpress:latest
ports:
- 80:80
volumes:
- ./www/html:/var/www/html
depends_on:
- db
environment:
WORDPRESS_DB_HOST: db:3306
WORDPRESS_DB_USER: wordpress
WORDPRESS_DB_PASSWORD: wordpress
WORDPRESS_DB_NAME: wordpress
db:
image: mysql:5.7
container_name: mysql
ports:
- 3306:3306
volumes:
- ./db:/var/lib/mysql
environment:
MYSQL_ROOT_PASSWORD: secret
MYSQL_DATABASE: wordpress
MYSQL_USER: wordpress
MYSQL_PASSWORD: wordpress
phpmyadmin:
image: phpmyadmin/phpmyadmin:latest
ports:
- 8888:80
depends_on:
- db
尽管没有提到关于php和nginx的描述，但据说通过启动WordPress容器，它们会自动准备好。
服务: WordPress和DB代表了容器名称。
它们分别指定了要展开的内容的图像。
您可以指定具体的版本，也可以自动展开最新版本，就像在WordPress容器中添加”:latest”一样。
卷：在这里指定展开的位置。
depends_on：在这里指定依赖的容器名。在这里，我们创建了一个MySQL5.7的容器作为WordPress的数据库，并将其容器名指定为db，因此在容器名中指定为db。
然后是根据MySQL的设置等。
最重要的是端口部分。在我的环境中，我没有将80端口用于其他用途，所以我将它设置为80:80。
现在，当访问http://127.0.0.1/时，WordPress就会展开。
顺便安装了phpMyAdmin，并从docker-hub下载和解压最新版本。由于设置了ports: 8888:80，因此可以通过http://127.0.0.1:8888进行访问。
在运行容器后，MySQL相关的文件会被放置在数据库目录中。
只要到了这一步，就只需要启动了。
在终端中移动到包含docker-compose.yml文件的目录，并执行以下命令。
docker-compose up -d
初次访问需要一些时间来进行各种下载，但即使如此，也只需几分钟即可完成。只要能够访问 http://127.0.0.1/ 并显示WordPress的设置界面，就可以了。
顺便一提，由于我已经安装了 phpMyAdmin，我们也可以检查一下 http://127.0.0.1:8080。在 docker-compose.yml 中应该已经创建了适用于 WordPress 的数据库和用户。
首次启动使用上述命令进行，但是从第二次开始，可以通过菜单栏上的Docker图标选择”仪表板”，然后显示先前创建的容器，可以通过这里执行。
这次就到这里吧。
下次我们会在wordpress的underscores主题中添加sassify选项，并在phpStorm中设置Sass watcher，搭建自动编译环境。
※2020/7/16 16:20 我更新了续篇。
使用Mac+Docker上的phpStorm来从零开始创建WordPress主题（3/3）。
