wordpress: 安装 tailwind 风格主题

# 打开这个：
https://github.com/aric-docker/docker-sqlite-wordpress

# clone 成自己的项目
git@github.com:aric-docker/docker-sqlite-wordpress.git

$ tree -L 2
.
├── Dockerfile
├── LICENSE
├── README.md
├── docker-compose.yml
├── node_modules
├── package.json
└── wordpress
    ├── index.php
    ├── license.txt
    ├── readme.html
    ├── wp-activate.php
    ├── wp-admin
    ├── wp-blog-header.php
    ├── wp-comments-post.php
    ├── wp-config-docker.php
    ├── wp-config-sample.php
    ├── wp-config.php
    ├── wp-content
    ├── wp-cron.php
    ├── wp-includes
    ├── wp-links-opml.php
    ├── wp-load.php
    ├── wp-login.php
    ├── wp-mail.php
    ├── wp-settings.php
    ├── wp-signup.php
    ├── wp-trackback.php
    └── xmlrpc.php

到对应目录操作 wordpress/wp-content/themes，启用主题

cd wordpress/wp-content/themes
git clone git@github.com:wpperformance/press-wind.git

到对应目录操作 wordpress/wp-content/plugins ，启用插件

cd wordpress/wp-content/plugins
git clone git@github.com:wpperformance/presswind-helpers.git

保证 php 也可以正常使用 tw 语法，路径：wordpress/wp-content/themes/press-wind/tailwind.config.js

// we recommend preflight to false for avoid conflict in editor
const usePreflightFront = false

module.exports = {
  content: [
    './*.php',
    './patterns/**/*.php',
    './blocks/**/*.php',
    './inc/**/*.php',
    './admin/**/*.{js,jsx,ts,tsx,vue,php}',
    './assets/**/*.{js,jsx,ts,tsx,vue}',
    './main.js',
  ],
}

简单版本

// we recommend preflight to false for avoid conflict in editor
const usePreflightFront = false

module.exports = {
  content: [
    './*.{php,html}',
    './assets/*.{js,jsx,ts,tsx,vue}',
  ]
}

保证 container 可访问，对应文件为 wordpress/wp-content/themes/press-wind/vite.config.js

// https://vitejs.dev/config/
export const viteConfig = {
  server: {
    host: true,
  },
}

export default defineConfig(viteConfig)

安装 node_modules 并运行 vite 开发模式

# 安装
docker-compose exec wordpress bash -c 'cd /var/www/html/wp-content/themes/press-wind && yarn install'
# dev 模式
docker-compose exec wordpress bash -c 'cd /var/www/html/wp-content/themes/press-wind && yarn dev'

打开这个路径，让 baseSsl() 插件产生的测试 https 可以正常打开

https://localhost:3000/wp-content/themes/press-wind/