feat: support nested plugins (#176)

Co-authored-by: Anthony Fu <[email protected]>
unjs · Oct 18, 2022 · d35e055 · d35e055
1 parent 55d7170
commit d35e055
Show file tree

Hide file tree

Showing 17 changed files with 524 additions and 400 deletions.
diff --git a/README.md b/README.md
@@ -75,7 +75,42 @@ export const webpackPlugin = unplugin.webpack
 export const esbuildPlugin = unplugin.esbuild
 ```
 
-### Plugin Installation
+## Nested Plugins
+
+Since `v0.10.0`, unplugin supports constructing multiple nested plugins to behave like a single one. For example:
+
+###### Supported
+
+| Rollup | Vite | Webpack 4 | Webpack 5 | esbuild |
+| :----: | :--: | :-------: | :-------: | :-----: |
+| ✅ `>=3.1` | ✅ | ✅ | ✅ | ⚠️<sup>5</sup> |
+
+5. Since esbuild does not have a built-in transform phase, the `transform` hook of nested plugin will not work on esbuild yet. Other hooks like `load` or `resolveId` work fine. We will try to find a way to support it in the future.
+
+###### Usage
+
+```ts
+import { createUnplugin } from 'unplugin'
+
+export const unplugin = createUnplugin((options: UserOptions) => {
+  return [
+    {
+      name: 'plugin-a',
+      transform (code) {
+        // ...
+      }
+    },
+    {
+      name: 'plugin-b',
+      resolveId (id) {
+        // ...
+      }
+    }
+  ]
+})
+```
+
+## Plugin Installation
 
 ###### Vite
 

diff --git a/package.json b/package.json
@@ -41,7 +41,7 @@
     "@nuxtjs/eslint-config-typescript": "^11.0.0",
     "@types/express": "^4.17.14",
     "@types/fs-extra": "^9.0.13",
-    "@types/node": "^18.7.16",
+    "@types/node": "^18.11.0",
     "@types/webpack-sources": "^3.2.0",
     "bumpp": "^8.2.1",
     "conventional-changelog-cli": "^2.2.2",
@@ -53,7 +53,7 @@
     "jiti": "^1.16.0",
     "magic-string": "^0.26.7",
     "picocolors": "^1.0.0",
-    "rollup": "^2.79.1",
+    "rollup": "^3.2.2",
     "tsup": "^6.3.0",
     "typescript": "^4.8.4",
     "vite": "^3.1.8",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/scripts/buildFixtures.ts b/scripts/buildFixtures.ts
@@ -22,7 +22,7 @@ async function run () {
     execSync('npx vite build', { cwd: path, stdio: 'inherit' })
     console.log(c.red(c.inverse(c.bold('\n  Rollup  '))), name, '\n')
     execSync('npx rollup --version', { cwd: path, stdio: 'inherit' })
-    execSync('npx rollup -c', { cwd: path, stdio: 'inherit' })
+    execSync('npx rollup --bundleConfigAsCjs -c', { cwd: path, stdio: 'inherit' })
     console.log(c.blue(c.inverse(c.bold('\n  Webpack  '))), name, '\n')
     execSync('npx webpack --version', { cwd: path, stdio: 'inherit' })
     execSync('npx webpack', { cwd: path, stdio: 'inherit' })