From 49ffdf05e5897048359106d92ca4d219041a1881 Mon Sep 17 00:00:00 2001 From: zjxxxxxxxxx <954270063@qq.com> Date: Tue, 12 Sep 2023 23:31:04 +0800 Subject: [PATCH] feat: add rollup and webpack plugin --- .DS_Store | Bin 0 -> 6148 bytes examples/.DS_Store | Bin 0 -> 6148 bytes examples/rollup/rollup.config.js | 2 +- examples/vite/src/App.vue | 2 +- src/.DS_Store | Bin 0 -> 6148 bytes src/core/constants.ts | 2 ++ src/core/index.ts | 43 +++++++++---------------------- src/core/parse_ID.ts | 29 +++++++++++++++++++++ src/core/transform_JSX.ts | 3 +++ src/core/transform_SFC.ts | 28 ++++++++++++++++++++ 10 files changed, 76 insertions(+), 33 deletions(-) create mode 100644 .DS_Store create mode 100644 examples/.DS_Store create mode 100644 src/.DS_Store create mode 100644 src/core/parse_ID.ts create mode 100644 src/core/transform_JSX.ts create mode 100644 src/core/transform_SFC.ts diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..a4e7cd5f4db87404521f9f5168811264126732d0 GIT binary patch literal 6148 zcmeHLJxc>Y5PcgX#1Al)2#TCwCyGH!i&J8wjbfpl8Wa2=@q!w#Jh1Q|h^2)#g1x08 z`WyTMmWrj7II}yNT`vYJQQ3jrcegXM^YU`Hn+*UpRV(IzEPxC(#&kP%4UGNV5|)yY z9zw-)l-F|$Yf+_|i1Y(q0k6PsRDj>zG)AzFP3$@EZ|Zs8_En;MzEF+|G?sbFJx=y7 z-A=mxVpD&0!&)2KPAHWY6{(92)KEa+)JJN(QH;&wW%(d;v8Z_@=Bh+>KF#7BUV0rQ zJ&L5p?k7DkbWMCdd^V5ki<_;1cReK6uHVS-)J=^VJxbWeDk`X=j1qPoJ%*QhwH}{h zY#trw*@x42JrZ$sJ(|Tiyv9zLS0}a+ktQW96F0u9CHeK;?VL4>wRz5T&&|s7^X1&O ze&30=c?Snq%)5oY!yT+SDq`@m?y)&dyms9SC&{xJ9Jd}F%9AEuyB_e&_5PaCp3Ro& zFz9=)fLFjP@Sy;&4*@mCP%t*Amk#Rm5r8mF!`kSY&k~#y2!?{OLGq9(lS*h(l^ijY zNvH8Z;zGgLph<_4!-tZ}N=_(BSEu;{9S#*5^u1TWE8r^7Vs5j%|4)B?{&$o7omaps z@UIk5>HI=|iawI;t%(oEdu>2%g&G^j#Rhc>b+R4n3*L(Pe+6yi3;2RC6pRhh2$}yO Npk?r#SKvn#cms}o%W(hz literal 0 HcmV?d00001 diff --git a/examples/.DS_Store b/examples/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..4a39421664c93fe59f7cb3fc246309f65c3ab3fe GIT binary patch literal 6148 zcmeHKJ5Iwu5PcgQ2!bLK4Ha^MfRdC@naG?V1vE&Ij{uR#79!BP;s)vIC}_9@*FZ=) z0XN{y?h@=c5fuobnP~Q{XJ>ZS&z2_xz%+;522cl3qY74*Im{4Q7cEJ}TULq2?lDB# zKX0@;$sjFxtKly)AkS_Q*GSOkZ~FNKqqXVvK@!L9e$uABw*T}#dOUhLDEoB3^+_*s z?@9H6TOhzKE^ⅈT_uEe9f=r^PdEby^Uj=e-b-LzH-l6FXY{Mle|l~Ll14FI70_l zh3w{jtL%|K!}xjk^9)n_uEW9E=66yrjPF4XuI!?clegq+Yw6~s u)`rwms)+by4ksa;*iuYiDaGqlE3}6)Ax0iEhqO@ikAS5?2W8+_8TbHFuV~8v literal 0 HcmV?d00001 diff --git a/examples/rollup/rollup.config.js b/examples/rollup/rollup.config.js index 7ba7ef4..f1f85ee 100644 --- a/examples/rollup/rollup.config.js +++ b/examples/rollup/rollup.config.js @@ -26,6 +26,7 @@ export default { format: "esm", }, plugins: [ + VueSource({}), vue({ exposeFilename: true, }), @@ -46,7 +47,6 @@ export default { svg({ base64: true, }), - VueSource({}), liveServer({ port: 3000, wait: 1000, diff --git a/examples/vite/src/App.vue b/examples/vite/src/App.vue index dc5a801..6f2ebb1 100644 --- a/examples/vite/src/App.vue +++ b/examples/vite/src/App.vue @@ -1,4 +1,4 @@ - diff --git a/src/.DS_Store b/src/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..db743822a9109895b3d1baa4903c626a38a60233 GIT binary patch literal 6148 zcmeHKJx{|>474Fb5KBkK_ZK>{g(~bwT^LbY1VgJ-mDsbfGx3MmS@}1dKR}71GBUtf z^1D3SmzUfS$0DMOr_EesCL%T5P@Zj>n&r(Wc9M|_sCJL-!+g2!cKb=?@qlqFSxYAe zxgYb-K8Cqn*S4!|w?eFbdA)qEZr`rP`OS~{{p0Z2Za}3`0V+TRr~noCmkOX~o7Lxm zT&VyRpaS0t*!Q8p4V%P1&_5kmd;|d6Z@e3>eU<ujh!-yxZ34Mc0V*(7;54=~>;KpABlG{5#2po&0)I*Yt=eU~ zz$;~MoxGg&+5*3We;I1M9E-PNptoXdtQB7j>WW<>-z4^dPDkA7K>i4rE;K6e8wz{^ DmgXrk literal 0 HcmV?d00001 diff --git a/src/core/constants.ts b/src/core/constants.ts index 7445e99..db59882 100644 --- a/src/core/constants.ts +++ b/src/core/constants.ts @@ -8,3 +8,5 @@ export const ElementTypes = { ELEMENT: 0, COMPONENT: 1, }; + +export const TagTypes = [ElementTypes.ELEMENT, ElementTypes.COMPONENT]; diff --git a/src/core/index.ts b/src/core/index.ts index 23bf330..c33917c 100644 --- a/src/core/index.ts +++ b/src/core/index.ts @@ -1,51 +1,32 @@ -import { relative } from "path"; import type { UnpluginFactory } from "unplugin"; import { createUnplugin } from "unplugin"; -import { parse, transform } from "@vue/compiler-dom"; -import MagicString from "magic-string"; import type { Options } from "../types"; -import { ElementTypes, NodeTypes, TRACE_ID } from "./constants"; +import { parse_ID } from "./parse_ID"; +import { transform_SFC } from "./transform_SFC"; +// import { transform_JSX } from "./transform_JSX"; -const filterRE = /.(vue|jsx|tsx)$/; -const TagTypes = [ElementTypes.ELEMENT, ElementTypes.COMPONENT]; +const includeRE = /.((vue\?vue)|(vue|jsx|tsx)$)/; export const unpluginFactory: UnpluginFactory = (options = {}) => { - const { rootDir = process.cwd() } = options; - if (process.env.NODE_ENV !== "development") { return { name: "unplugin-vue-source", }; } + const { rootDir = process.cwd() } = options; + return { name: "unplugin-vue-source", enforce: "pre", transformInclude(id) { - return filterRE.test(id); + return includeRE.test(id); }, - transform(raw, id) { - const relativePath = `/${relative(rootDir, id)}`; - - const s = new MagicString(raw); - transform(parse(raw), { - nodeTransforms: [ - (node) => { - if ( - node.type === NodeTypes.ELEMENT && - TagTypes.includes(node.tagType as any) - ) { - const { line, column, offset } = node.loc.start; - const startIndex = offset + node.tag.length + 1; - s.prependLeft( - startIndex, - ` ${TRACE_ID}="${relativePath}:${line}:${column}"` - ); - } - }, - ], - }); - return s.toString(); + transform(code, id) { + const { filename, query } = parse_ID(id, rootDir); + if (!query.type || query.type === "template") { + return transform_SFC(filename, code); + } }, }; }; diff --git a/src/core/parse_ID.ts b/src/core/parse_ID.ts new file mode 100644 index 0000000..9cf71ef --- /dev/null +++ b/src/core/parse_ID.ts @@ -0,0 +1,29 @@ +import { extname } from "path"; + +export interface VueQuery { + vue?: boolean; + src?: string; + type?: "script" | "template" | "style" | "custom"; + lang?: string; +} + +export function parse_ID( + id: string, + rootDir: string +): { + filename: string; + ext: string; + query: VueQuery; +} { + const [filename, rawQuery] = id.split(`?`, 2); + const query = Object.fromEntries(new URLSearchParams(rawQuery)) as VueQuery; + if (query.vue != null) { + query.vue = true; + } + + return { + filename: filename.replace(rootDir, ""), + ext: extname(filename).slice(1), + query, + }; +} diff --git a/src/core/transform_JSX.ts b/src/core/transform_JSX.ts new file mode 100644 index 0000000..353a6aa --- /dev/null +++ b/src/core/transform_JSX.ts @@ -0,0 +1,3 @@ +export function transform_JSX(filename: string, code: string, tsx: boolean) { + return undefined; +} diff --git a/src/core/transform_SFC.ts b/src/core/transform_SFC.ts new file mode 100644 index 0000000..deba233 --- /dev/null +++ b/src/core/transform_SFC.ts @@ -0,0 +1,28 @@ +import { parse, transform } from "@vue/compiler-dom"; +import MagicString from "magic-string"; +import { NodeTypes, TRACE_ID, TagTypes } from "./constants"; + +export function transform_SFC(filename: string, code: string) { + const s = new MagicString(code); + + const ast = parse(code); + transform(ast, { + nodeTransforms: [ + (node) => { + if ( + node.type === NodeTypes.ELEMENT && + TagTypes.includes(node.tagType as any) + ) { + const { line, column, offset } = node.loc.start; + const startIndex = offset + node.tag.length + 1; + s.prependLeft( + startIndex, + ` ${TRACE_ID}="${filename}:${line}:${column}"` + ); + } + }, + ], + }); + + return s.toString(); +}