From dec8c72f66d24c99acf77ae21cce4b8c5bdfca3b Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Tue, 6 Jun 2023 23:30:28 +0200 Subject: [PATCH 1/4] preserve directives --- package.json | 1 + src/plugins/directive-plugin.ts | 25 +++++++++++++++++++++++++ yarn.lock | 14 +++++++------- 3 files changed, 33 insertions(+), 7 deletions(-) create mode 100644 src/plugins/directive-plugin.ts diff --git a/package.json b/package.json index 2cba4936..c1c5869a 100644 --- a/package.json +++ b/package.json @@ -53,6 +53,7 @@ "@swc/core": "1.3.46", "@swc/helpers": "0.5.0", "arg": "5.0.2", + "magic-string": "0.30.0", "pretty-bytes": "5.6.0", "publint": "0.1.11", "rollup": "3.20.2", diff --git a/src/plugins/directive-plugin.ts b/src/plugins/directive-plugin.ts new file mode 100644 index 00000000..ca91cc96 --- /dev/null +++ b/src/plugins/directive-plugin.ts @@ -0,0 +1,25 @@ +const MagicString = require('magic-string'); + +module.exports = function useDirectivePlugin() { + return { + name: 'use-directive', + + transform(code, id) { + let magicString = new MagicString(code); + let match; + let useDirective = ''; + const regex = /^use [^\n;]*;/; + + if ((match = regex.exec(code)) !== null) { + useDirective = match[0]; + magicString.remove(0, match[0].length); + } + + return { + code: magicString.toString(), + map: magicString.generateMap({ hires: true }), + banner: useDirective, + }; + } + }; +}; diff --git a/yarn.lock b/yarn.lock index e4f448e4..c532ebc1 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2161,6 +2161,13 @@ lru-cache@^6.0.0: dependencies: yallist "^4.0.0" +magic-string@0.30.0, magic-string@^0.30.0: + version "0.30.0" + resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.30.0.tgz#fd58a4748c5c4547338a424e90fa5dd17f4de529" + integrity sha512-LA+31JYDJLs82r2ScLrlz1GjSgu66ZV518eyWT+S8VhyQn/JL0u9MeBOvQMGYiPk1DBiSN9DDMOcXvigJZaViQ== + dependencies: + "@jridgewell/sourcemap-codec" "^1.4.13" + magic-string@^0.25.7: version "0.25.9" resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.9.tgz#de7f9faf91ef8a1c91d02c2e5314c8277dbcdd1c" @@ -2175,13 +2182,6 @@ magic-string@^0.27.0: dependencies: "@jridgewell/sourcemap-codec" "^1.4.13" -magic-string@^0.30.0: - version "0.30.0" - resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.30.0.tgz#fd58a4748c5c4547338a424e90fa5dd17f4de529" - integrity sha512-LA+31JYDJLs82r2ScLrlz1GjSgu66ZV518eyWT+S8VhyQn/JL0u9MeBOvQMGYiPk1DBiSN9DDMOcXvigJZaViQ== - dependencies: - "@jridgewell/sourcemap-codec" "^1.4.13" - make-dir@^3.0.0: version "3.1.0" resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-3.1.0.tgz#415e967046b3a7f1d185277d84aa58203726a13f" From a018585437725cc640db9314e87cb81ba334b9d3 Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Mon, 26 Jun 2023 00:39:32 +0200 Subject: [PATCH 2/4] match all directives and append to output --- src/build-config.ts | 4 +- src/plugins/directive-plugin.ts | 49 ++++++++++++------- .../__snapshot__/use-client.js.snapshot | 8 +++ .../__snapshot__/use-client.min.js.snapshot | 1 + test/unit/use-client/input.js | 7 +++ 5 files changed, 50 insertions(+), 19 deletions(-) create mode 100644 test/unit/use-client/__snapshot__/use-client.js.snapshot create mode 100644 test/unit/use-client/__snapshot__/use-client.min.js.snapshot create mode 100644 test/unit/use-client/input.js diff --git a/src/build-config.ts b/src/build-config.ts index 2afc8bf5..1b5b1296 100644 --- a/src/build-config.ts +++ b/src/build-config.ts @@ -15,11 +15,11 @@ import { resolve, dirname } from 'path' import { wasm } from '@rollup/plugin-wasm' import { swc } from 'rollup-plugin-swc3' import commonjs from '@rollup/plugin-commonjs' -import shebang from 'rollup-plugin-preserve-shebang' import json from '@rollup/plugin-json' import { nodeResolve } from '@rollup/plugin-node-resolve' import replace from '@rollup/plugin-replace' import createChunkSizeCollector from './plugins/size-plugin' +import preserveDirectivePlugin from './plugins/directive-plugin' import { getTypings, getExportPaths, @@ -87,7 +87,7 @@ function buildInputConfig( ) const sizePlugin = sizeCollector.plugin(cwd) const commonPlugins = [ - shebang(), + preserveDirectivePlugin(), sizePlugin, ] const plugins: Plugin[] = ( diff --git a/src/plugins/directive-plugin.ts b/src/plugins/directive-plugin.ts index ca91cc96..27711687 100644 --- a/src/plugins/directive-plugin.ts +++ b/src/plugins/directive-plugin.ts @@ -1,25 +1,40 @@ -const MagicString = require('magic-string'); +import type { Plugin } from 'rollup' +import MagicString from 'magic-string' -module.exports = function useDirectivePlugin() { + + +export default function preserveDirectivePlugin(): Plugin { + const fileDirectivesMap = new Map() return { name: 'use-directive', transform(code, id) { - let magicString = new MagicString(code); - let match; - let useDirective = ''; - const regex = /^use [^\n;]*;/; - - if ((match = regex.exec(code)) !== null) { - useDirective = match[0]; - magicString.remove(0, match[0].length); - } + const regex = /^(?:['"]use[^'"]+['"][^\n]*|#![^\n]*)/gm + const directives: Set = new Set() + + const replacedCode = code.replace(regex, (match) => { + directives.add(match); + return '' + }) + fileDirectivesMap.set(id, directives) return { - code: magicString.toString(), - map: magicString.generateMap({ hires: true }), - banner: useDirective, - }; + code: replacedCode, + map: null, + } + }, + + renderChunk(code, chunk, { sourcemap }) { + let directives = fileDirectivesMap.get(chunk.facadeModuleId) + if (!directives) return null + + const s = new MagicString(code) + s.prepend(`${[...directives].join('\n')}\n`) + + return { + code: s.toString(), + map: sourcemap ? s.generateMap({ hires: true }) : null + } } - }; -}; + } +} diff --git a/test/unit/use-client/__snapshot__/use-client.js.snapshot b/test/unit/use-client/__snapshot__/use-client.js.snapshot new file mode 100644 index 00000000..1335cacd --- /dev/null +++ b/test/unit/use-client/__snapshot__/use-client.js.snapshot @@ -0,0 +1,8 @@ +'use strict'; +'use client' +var input = (()=>{ + React.useState(null); + return null; +}); + +export { input as default }; diff --git a/test/unit/use-client/__snapshot__/use-client.min.js.snapshot b/test/unit/use-client/__snapshot__/use-client.min.js.snapshot new file mode 100644 index 00000000..3208fc2f --- /dev/null +++ b/test/unit/use-client/__snapshot__/use-client.min.js.snapshot @@ -0,0 +1 @@ +"use strict";var t=()=>(React.useState(null),null);export{t as default}; diff --git a/test/unit/use-client/input.js b/test/unit/use-client/input.js new file mode 100644 index 00000000..e0b5b7fb --- /dev/null +++ b/test/unit/use-client/input.js @@ -0,0 +1,7 @@ +'use strict'; +'use client' + +export default () => { + React.useState(null) + return null +} From d80692bdcb06ffbe64deb888388af2bdbfae5959 Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Mon, 26 Jun 2023 00:40:08 +0200 Subject: [PATCH 3/4] remove shebang plugin --- env.d.ts | 4 ---- package.json | 1 - yarn.lock | 19 ------------------- 3 files changed, 24 deletions(-) delete mode 100644 env.d.ts diff --git a/env.d.ts b/env.d.ts deleted file mode 100644 index 675fd3eb..00000000 --- a/env.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -declare module 'rollup-plugin-preserve-shebang' { - import { Plugin } from 'rollup' - export default function shebang(): Plugin -} diff --git a/package.json b/package.json index c1c5869a..de8d5cb8 100644 --- a/package.json +++ b/package.json @@ -58,7 +58,6 @@ "publint": "0.1.11", "rollup": "3.20.2", "rollup-plugin-dts": "5.3.0", - "rollup-plugin-preserve-shebang": "1.0.1", "rollup-plugin-swc3": "0.8.1", "tslib": "2.5.0" }, diff --git a/yarn.lock b/yarn.lock index c532ebc1..45cbd3a7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2168,13 +2168,6 @@ magic-string@0.30.0, magic-string@^0.30.0: dependencies: "@jridgewell/sourcemap-codec" "^1.4.13" -magic-string@^0.25.7: - version "0.25.9" - resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.9.tgz#de7f9faf91ef8a1c91d02c2e5314c8277dbcdd1c" - integrity sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ== - dependencies: - sourcemap-codec "^1.4.8" - magic-string@^0.27.0: version "0.27.0" resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.27.0.tgz#e4a3413b4bab6d98d2becffd48b4a257effdbbf3" @@ -2471,13 +2464,6 @@ rollup-plugin-dts@5.3.0: optionalDependencies: "@babel/code-frame" "^7.18.6" -rollup-plugin-preserve-shebang@1.0.1: - version "1.0.1" - resolved "https://registry.yarnpkg.com/rollup-plugin-preserve-shebang/-/rollup-plugin-preserve-shebang-1.0.1.tgz#17109cdb4ed12c3cac9379b802182427cdbee5a1" - integrity sha512-gk7ExGBqvUinhgrvldKHkAKXXwRkWMXMZymNkrtn50uBgHITlhRjhnKmbNGwAIc4Bzgl3yLv7/8Fhi/XeHhFKg== - dependencies: - magic-string "^0.25.7" - rollup-plugin-swc3@0.8.1: version "0.8.1" resolved "https://registry.yarnpkg.com/rollup-plugin-swc3/-/rollup-plugin-swc3-0.8.1.tgz#40ce99da95faf6202e18792e1faa4d22a6aaa4ce" @@ -2566,11 +2552,6 @@ source-map@^0.6.0, source-map@^0.6.1: resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263" integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g== -sourcemap-codec@^1.4.8: - version "1.4.8" - resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz#ea804bd94857402e6992d05a38ef1ae35a9ab4c4" - integrity sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA== - sprintf-js@~1.0.2: version "1.0.3" resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c" From a952c0adf693fca29bbb41d77d7959046c835543 Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Mon, 26 Jun 2023 00:44:35 +0200 Subject: [PATCH 4/4] fix empty case --- src/plugins/directive-plugin.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/plugins/directive-plugin.ts b/src/plugins/directive-plugin.ts index 27711687..d50ced63 100644 --- a/src/plugins/directive-plugin.ts +++ b/src/plugins/directive-plugin.ts @@ -13,11 +13,12 @@ export default function preserveDirectivePlugin(): Plugin { const directives: Set = new Set() const replacedCode = code.replace(regex, (match) => { - directives.add(match); + // replace double quotes with single quotes + directives.add(match.replace(/["]/g, "'")) return '' }) - fileDirectivesMap.set(id, directives) + if (directives.size) fileDirectivesMap.set(id, directives) return { code: replacedCode, map: null,