ノンカフェインであなたにやさしい

Ruby,Rails,HTML,CSS,Reactなど

WordPress開発環境をwp-envで簡単に作る

npmの @wordpress/env を使うとメチャクチャ簡単にDockerでWP環境が作れました。
基本的に公式ドキュメント通りに設定するだけです。 ja.wordpress.org

@wordpress/env をインストール

# グローバルに入れるか
npm -g i @wordpress/env

# ローカルプロジェクトに入れる
npm i @wordpress/env --save-dev

WP環境の立ち上げ

wp-env start

おしまい

なんですが個人的に必要な設定など

入れておくと便利な設定

.wp-env.json に設定を書きます

{
  // ローカルのテーマを同期
  "themes": [ "./wordpress/wp-content/themes/my_themes" ],
  "mappings": {
    // テーマ以外に同期させたいフォルダ、ファイルの設定
    // アップロードしたファイルも同期させる
    "wp-content/uploads": "./wordpress/wp-content/uploads",
    // DBのDumpデータをインポートしたいので同期
    "import.sql": "./import.sql"
  },
  // 使いたいプラグインを入れる
  "plugins": [
    "https://downloads.wordpress.org/plugin/advanced-custom-fields.5.9.5.zip",
    "https://downloads.wordpress.org/plugin/no-category-base-wpml.zip",
    "https://downloads.wordpress.org/plugin/wp-pagenavi.2.93.4.zip",
    "https://downloads.wordpress.org/plugin/contact-form-7.5.4.zip",
    "https://downloads.wordpress.org/plugin/flamingo.2.2.1.zip",
    "https://downloads.wordpress.org/plugin/favicon-rotator.zip",
    "https://downloads.wordpress.org/plugin/all-in-one-seo-pack.4.1.0.1.zip",
    "https://downloads.wordpress.org/plugin/custom-post-type-ui.1.9.0.zip",
    "https://downloads.wordpress.org/plugin/taxonomy-terms-order.1.5.7.5.zip",
    "https://downloads.wordpress.org/plugin/custom-post-type-permalinks.3.4.4.zip",
    "https://downloads.wordpress.org/plugin/really-simple-csv-importer.zip",
    "https://downloads.wordpress.org/plugin/rs-csv-importer-media-addon.1.1.0.zip",
    "https://downloads.wordpress.org/plugin/tinymce-advanced.5.6.0.zip"
  ]
}

DBのインポート

npx wp-env run cli wp db import import.sql

GitHub ActionsでXserverにあるWPに自動デプロイを設定する

1.GitHubのSecretsにXserverの秘密鍵を登録する

公式を参考 docs.github.com

2..github/actions/deploy.yml 作成

name: deploy to xserver

on:
  push:
    branches:
      - main

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      # 必要に応じてgulpなど
      # - name: gulp build
      #   uses: actions/setup-node@v1
      # - run: yarn install && yarn run build\
      - name: Install SSH key
        uses: shimataro/ssh-key-action@v2
        with:
          key: ${{ secrets.SSH_PRIVATE_KEY }}
          known_hosts: sv1111.xserver.jp
      - name: rsync deploy
        run: rsync -vrlp -e "ssh -p 10022 -o UserKnownHostsFile=/dev/null -o StrictHostKeyChecking=no" ./dist/ username@sv1111.xserver.jp:/home/username/example.net/public_html/dist/

参考

Puppeteerでライブラリ不足 libgbm.so.1

以下のエラー

chrome: error while loading shared libraries: libgbm.so.1: cannot open shared object file: No such file or directory

インストールする

sudo apt-get install -y libgbm-dev

Puppeteerでライブラリ不足 libxkbcommon.so.0

以下のエラー

chrome: error while loading shared libraries: libxkbcommon.so.0: cannot open shared object file: No such file or directory

インストールする

sudo apt-get install libxkbcommon-x11-0