feat: 新增 tailwind block class & 改用 pnpm

Author: j7-dev

README.md

@@ -26,7 +26,7 @@ https://github.com/j7-dev/wp-react-plugin/assets/9213776/efb5b3ae-b8d0-408c-8e66
    cd to `wp-content/plugins/` in your WordPress project
    and `npx create-wp-react-plugin <your-plugin-name>`, that's all the steps
 
-	 🚩 we use yarn by default for now
+	 🚩 we use pnpm by default for now
 
 2. CRUD utility function<br>
    Default with `getPost` Example, check [functions](https://github.com/j7-dev/wp-react-plugin/tree/master/js/src/api/resources) and [custom hooks](https://github.com/j7-dev/wp-react-plugin/tree/master/js/src/hooks)
@@ -45,7 +45,7 @@ https://github.com/j7-dev/wp-react-plugin/assets/9213776/efb5b3ae-b8d0-408c-8e66
 	By defining the `$required_plugins`, we can easily manage plugin dependencies.
 
 7. 1-click release
-	Simply type `yarn release` and the command will execute a series of command in `release/.release-it.cjs`, like `yarn build`, `composer install` etc..., and finally publish a release on github
+	Simply type `pnpm release` and the command will execute a series of command in `release/.release-it.cjs`, like `pnpm build`, `composer install` etc..., and finally publish a release on github
 	see more configuration in [release-it](https://www.npmjs.com/package/release-it)
 
 ---
@@ -94,7 +94,7 @@ Libraries we used
 
 ```bash
 cd wp-content/plugins/<your-plugin-name>
-yarn dev
+pnpm dev
 ```
 
 Sure we have HMR when you change the front-end content
@@ -105,7 +105,7 @@ Sure we have HMR when you change the front-end content
 
 ```bash
 cd wp-content/plugins/<your-plugin-name>
-yarn release:build-only
+pnpm release:build-only
 ```
 
 This command will build the release version of your plugin without publish to Github in `release` directory, you can see a `zip` file and a directory with `<your-plugin-name>`
@@ -119,7 +119,7 @@ We can move to next step after checking everything works well.
 
 ```bash
 cd wp-content/plugins/<your-plugin-name>
-yarn release # this will git tag a patch version, you can choose `yarn release:minor` or `yarn release:major`
+pnpm release # this will git tag a patch version, you can choose `pnpm release:minor` or `pnpm release:major`
 ```
 
 This command will build the release version and publish the plugin `zip` file to Github.

bin/create.cjs

@@ -10,7 +10,7 @@ async function main() {
 	const commands = [
 		`git clone https://github.com/j7-dev/wp-react-plugin.git ${projectName}`,
 		`cd ${projectName}`,
-		'yarn',
+		'pnpm',
 		`node ./replace-string.cjs ${projectName}`,
 		'composer install --no-interaction',
 		execRemove('.git'),

package.json

@@ -3,7 +3,7 @@
 	"version": "4.0.12",
 	"type": "module",
 	"scripts": {
-		"bootstrap": "yarn && composer install --no-interaction",
+		"bootstrap": "pnpm && composer install --no-interaction",
 		"dev": "vite",
 		"prebuild": "echo 'todo: remove console'",
 		"build": "vite build && node release/mv-manifest.cjs",
@@ -21,17 +21,18 @@
 		"sync:version": "wp-update-project-version -s package.json -p plugin.php",
 		"replace-string": "node ./replace-string.cjs",
 		"i18n": "wp i18n make-pot . languages/wp_react_plugin.pot",
-		"i18n:commit": "yarn i18n && git add . && git commit --amend --no-edit"
+		"i18n:commit": "pnpm i18n && git add . && git commit --amend --no-edit"
 	},
 	"dependencies": {
+		"@release-it/bumper": "^7.0.5",
 		"@tanstack/react-query": "4.36.1",
-		"axios": "^1.6.8",
+		"axios": "^1.13.2",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0"
 	},
 	"devDependencies": {
 		"@ant-design/cssinjs": "^1.19.1",
-		"@kucrut/vite-for-wp": "^0.8.0",
+		"@kucrut/vite-for-wp": "^0.12.0",
 		"@rollup/plugin-alias": "^5.1.0",
 		"@soderlind/wp-project-version-sync": "^2.0.2",
 		"@tanstack/react-query-devtools": "^5.28.10",
@@ -43,11 +44,11 @@
 		"@typescript-eslint/parser": "^7.4.0",
 		"@vitejs/plugin-react": "^4.2.1",
 		"@wordpress/eslint-plugin": "^17.11.0",
-		"adm-zip": "^0.5.12",
+		"adm-zip": "^0.5.16",
 		"archiver": "^7.0.1",
-		"autoprefixer": "^10.4.19",
+		"autoprefixer": "^10.4.22",
 		"change-case-all": "^2.1.0",
-		"env-cmd": "^10.1.0",
+		"env-cmd": "^11.0.0",
 		"eslint": "^8.57.0",
 		"eslint-config-airbnb": "^19.0.4",
 		"eslint-config-prettier": "^9.1.0",
@@ -57,14 +58,15 @@
 		"eslint-plugin-prettier": "^5.1.3",
 		"eslint-plugin-promise": "^6.1.1",
 		"eslint-plugin-react": "^7.34.1",
-		"postcss": "^8.4.38",
-		"postcss-import": "^16.1.0",
-		"postcss-nesting": "^12.1.0",
-		"prettier": "^3.2.5",
+		"postcss": "^8.5.6",
+		"postcss-import": "^16.1.1",
+		"postcss-nesting": "^13.0.2",
+		"prettier": "^3.7.4",
 		"prettier-eslint": "^16.3.0",
 		"prettier-eslint-cli": "^8.0.1",
 		"prettier-plugin-multiline-arrays": "^3.0.4",
-		"release-it": "^17.1.1",
+		"release-it": "^19.0.3",
+		"release-it-pnpm": "^4.6.6",
 		"replace-in-file": "^7.1.0",
 		"sass": "^1.72.0",
 		"tailwindcss": "^3.4.3",
@@ -73,8 +75,7 @@
 		"vite": "^5.2.7",
 		"vite-plugin-live-reload": "^3.0.3",
 		"vite-tsconfig-paths": "^4.3.2",
-		"yargs": "^17.7.2",
-		"yarn-upgrade-all": "^0.7.2"
+		"yargs": "^17.7.2"
 	},
 	"bin": "./bin/create.cjs"
 }

release/.release-it.cjs

@@ -19,25 +19,37 @@ const release = !args.includes('--build-only') // Build release only or build re
 
 module.exports = {
 	releasedPluginName,
+	"plugins": {
+		"release-it-pnpm": {
+			"disableRelease": !release,
+			publishCommand: 'exit 0', // 發佈到 npm 上的命令
+		},
+		"@release-it/bumper": {
+			"in": "package.json",
+			"out": "package.json",
+		},
+	},
 	git: {
 		commit: release,
 		commitMessage: 'chore: release v${version}',
 		tag: release,
 		tagName: 'v${version}',
 		commitArgs: ['-n'],
 		push: release,
+		requireCleanWorkingDir: release,
 	},
 	hooks: {
-		// 'before:init': [], // run before initialization
+	'before:init': [
+			'pnpm build && echo ✅ build success',
+		], // run before initialization
 		// 'after:[my-plugin]:bump': './bin/my-script.sh', // run after bumping version of my-plugin
 		'after:bump': [
-			'yarn build && echo ✅ build success',
 			release
-				? 'yarn sync:version && echo ✅ sync version success'
+				? 'pnpm sync:version && echo ✅ sync version success'
 				: 'echo 🚫 skip sync version',
-			'yarn create:release && echo ✅ create release files success',
+			'pnpm create:release && echo ✅ create release files success',
 			`cd release/${releasedPluginName}/${releasedPluginName} && composer install --no-dev && cd ../.. && echo ✅ composer install success`,
-			'yarn zip && echo ✅ create zip success',
+			'pnpm zip && echo ✅ create zip success',
 		], // run after bumping version
 		// 'after:git:release': 'echo After git push, before github release', // run after git push, before github release
 		'after:release': [

tailwind.config.cjs

@@ -34,7 +34,7 @@ module.exports = {
 	plugins: [
 		function ({ addUtilities }) {
 			const newUtilities = {
-				'.rtl': {
+				'.right-to-left': {
 					direction: 'rtl',
 				},
 
@@ -53,11 +53,26 @@ module.exports = {
 				},
 				'.tw-inline': {
 					display: 'inline'
+				},
+				'.tw-blur': {
+					'--tw-blur': 'blur(8px)',
+    			filter: "var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)",
 				}
 			}
 			addUtilities(newUtilities, ['responsive', 'hover'])
 		},
 	],
 	safelist: [],
-	blocklist: ['fixed', 'columns-1', 'columns-2', 'hidden', 'inline'],
+	blocklist: [
+		'hidden',
+		'columns-1',
+		'columns-2',
+		'fixed',
+		'block',
+		'inline',
+		'blur',
+		'size-full',
+		'container',
+		'rtl',
+	],
 }