@varlet/cli 2.7.3-alpha.1675176726761 → 2.7.3-alpha.1675236177820

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/lib/node/compiler/compileSFC.d.ts +4 -0
  2. package/lib/node/compiler/compileSFC.js +75 -56
  3. package/package.json +7 -7
package/lib/node/compiler/compileSFC.d.ts CHANGED
@@ -1,2 +1,6 @@
1
+ export declare function declareEmptySFC(): string;
2
+ export declare function replaceExportToDeclare(script: string): string;
3
+ export declare function injectExport(script: string): string;
4
+ export declare function injectScopeId(script: string, scopeId: string): string;
1
5
  export declare function injectRender(script: string, render: string): string;
2
6
  export declare function compileSFC(sfc: string): Promise<void>;
package/lib/node/compiler/compileSFC.js CHANGED
@@ -1,77 +1,96 @@
1
1
  import fse from 'fs-extra';
2
2
  import hash from 'hash-sum';
3
3
  import { parse, resolve } from 'path';
4
- import { parse as parseSFC, compileTemplate, compileStyle } from '@vue/compiler-sfc';
4
+ import { parse as parseSFC, compileTemplate, compileStyle, compileScript as compileScriptSFC } from '@vue/compiler-sfc';
5
5
  import { replaceExt, smartAppendFileSync } from '../shared/fsUtils.js';
6
6
  import { compileScript, getScriptExtname } from './compileScript.js';
7
7
  import { clearEmptyLine, compileLess, extractStyleDependencies, normalizeStyleDependency, STYLE_IMPORT_RE, } from './compileStyle.js';
8
- import logger from '../shared/logger.js';
9
8
  const { readFile, writeFileSync } = fse;
10
- const NORMAL_EXPORT_START_RE = /export\s+default\s+{/;
11
- const DEFINE_EXPORT_START_RE = /export\s+default\s+defineComponent\s*\(\s*{/;
9
+ const EXPORT = 'export default';
10
+ const SFC = '__sfc__';
11
+ const SFC_DECLARE = `const ${SFC} = `;
12
+ const RENDER = '__render__';
13
+ export function declareEmptySFC() {
14
+ return `${SFC_DECLARE}{}\n`;
15
+ }
16
+ export function replaceExportToDeclare(script) {
17
+ return script.replace(EXPORT, SFC_DECLARE);
18
+ }
19
+ export function injectExport(script) {
20
+ script += `\n${EXPORT} ${SFC}`;
21
+ return script;
22
+ }
23
+ export function injectScopeId(script, scopeId) {
24
+ script += `\n${SFC}.__scopeId = '${scopeId}'`;
25
+ return script;
26
+ }
12
27
  export function injectRender(script, render) {
13
- if (DEFINE_EXPORT_START_RE.test(script.trim())) {
14
- return script.trim().replace(DEFINE_EXPORT_START_RE, `${render}\nexport default defineComponent({
15
- render,\
16
- `);
17
- }
18
- if (NORMAL_EXPORT_START_RE.test(script.trim())) {
19
- return script.trim().replace(NORMAL_EXPORT_START_RE, `${render}\nexport default {
20
- render,\
21
- `);
22
- }
28
+ script = script.trim();
29
+ render = render.replace('export function render', `function ${RENDER}`);
30
+ script = script.replace(SFC_DECLARE, `${render}\n${SFC_DECLARE}`);
31
+ script += `\n${SFC}.render = ${RENDER}`;
23
32
  return script;
24
33
  }
25
34
  export async function compileSFC(sfc) {
26
35
  const sources = await readFile(sfc, 'utf-8');
36
+ const id = hash(sources);
27
37
  const { descriptor } = parseSFC(sources, { sourceMap: false });
28
38
  const { script, scriptSetup, template, styles } = descriptor;
29
- if (scriptSetup) {
30
- logger.warning(`\n Varlet Cli does not support compiling script setup syntax\
31
- \n The error in ${sfc}`);
32
- return;
39
+ let scriptContent;
40
+ let bindingMetadata;
41
+ if (script || scriptSetup) {
42
+ if (scriptSetup) {
43
+ const { content, bindings } = compileScriptSFC(descriptor, { id });
44
+ scriptContent = content;
45
+ bindingMetadata = bindings;
46
+ }
47
+ else {
48
+ // script only
49
+ scriptContent = script.content;
50
+ }
51
+ scriptContent = replaceExportToDeclare(scriptContent);
52
+ }
53
+ if (!scriptContent) {
54
+ scriptContent = declareEmptySFC();
33
55
  }
34
56
  // scoped
35
57
  const hasScope = styles.some((style) => style.scoped);
36
- const id = hash(sources);
37
58
  const scopeId = hasScope ? `data-v-${id}` : '';
38
- if (script) {
39
- // template
40
- const render = template &&
41
- compileTemplate({
42
- id,
43
- source: template.content,
44
- filename: sfc,
45
- compilerOptions: {
46
- scopeId,
47
- },
48
- });
49
- let { content } = script;
50
- if (render) {
51
- const { code } = render;
52
- content = injectRender(content, code);
53
- }
54
- // script
55
- await compileScript(content, sfc);
56
- // style
57
- for (let index = 0; index < styles.length; index++) {
58
- const style = styles[index];
59
- const file = replaceExt(sfc, `Sfc${index || ''}.${style.lang || 'css'}`);
60
- const { base, dir } = parse(file);
61
- const dependencyPath = normalizeStyleDependency(base, STYLE_IMPORT_RE);
62
- const cssFile = resolve(dir, `./style/index${getScriptExtname()}`);
63
- let { code } = compileStyle({
64
- source: style.content,
65
- filename: file,
66
- id: scopeId,
67
- scoped: style.scoped,
68
- });
69
- code = extractStyleDependencies(file, code, STYLE_IMPORT_RE);
70
- writeFileSync(file, clearEmptyLine(code), 'utf-8');
71
- smartAppendFileSync(cssFile, `import '${dependencyPath}.css'\n`);
72
- if (style.lang === 'less') {
73
- await compileLess(file);
74
- }
59
+ if (template) {
60
+ const render = compileTemplate({
61
+ id,
62
+ source: template.content,
63
+ filename: sfc,
64
+ compilerOptions: {
65
+ scopeId,
66
+ bindingMetadata,
67
+ },
68
+ }).code;
69
+ scriptContent = injectRender(scriptContent, render);
70
+ }
71
+ if (scopeId) {
72
+ scriptContent = injectScopeId(scriptContent, scopeId);
73
+ }
74
+ scriptContent = injectExport(scriptContent);
75
+ await compileScript(scriptContent, sfc);
76
+ // style
77
+ for (let index = 0; index < styles.length; index++) {
78
+ const style = styles[index];
79
+ const file = replaceExt(sfc, `Sfc${index || ''}.${style.lang || 'css'}`);
80
+ const { base, dir } = parse(file);
81
+ const dependencyPath = normalizeStyleDependency(base, STYLE_IMPORT_RE);
82
+ const cssFile = resolve(dir, `./style/index${getScriptExtname()}`);
83
+ let { code } = compileStyle({
84
+ source: style.content,
85
+ filename: file,
86
+ id: scopeId,
87
+ scoped: style.scoped,
88
+ });
89
+ code = extractStyleDependencies(file, code, STYLE_IMPORT_RE);
90
+ writeFileSync(file, clearEmptyLine(code), 'utf-8');
91
+ smartAppendFileSync(cssFile, `import '${dependencyPath}.css'\n`);
92
+ if (style.lang === 'less') {
93
+ await compileLess(file);
75
94
  }
76
95
  }
77
96
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@varlet/cli",
3
- "version": "2.7.3-alpha.1675176726761",
3
+ "version": "2.7.3-alpha.1675236177820",
4
4
  "type": "module",
5
5
  "description": "cli of varlet",
6
6
  "bin": {
@@ -68,8 +68,8 @@
68
68
  "vite": "4.0.4",
69
69
  "vue": "3.2.25",
70
70
  "vue-jest": "^5.0.0-alpha.8",
71
- "@varlet/vite-plugins": "2.7.3-alpha.1675176726761",
72
- "@varlet/shared": "2.7.3-alpha.1675176726761"
71
+ "@varlet/vite-plugins": "2.7.3-alpha.1675236177820",
72
+ "@varlet/shared": "2.7.3-alpha.1675236177820"
73
73
  },
74
74
  "devDependencies": {
75
75
  "@types/babel__core": "^7.1.12",
@@ -82,8 +82,8 @@
82
82
  "@types/semver": "^7.3.9",
83
83
  "@types/inquirer": "^9.0.2",
84
84
  "@types/sharp": "0.31.1",
85
- "@varlet/icons": "2.7.3-alpha.1675176726761",
86
- "@varlet/touch-emulator": "2.7.3-alpha.1675176726761"
85
+ "@varlet/touch-emulator": "2.7.3-alpha.1675236177820",
86
+ "@varlet/icons": "2.7.3-alpha.1675236177820"
87
87
  },
88
88
  "peerDependencies": {
89
89
  "@vue/runtime-core": "3.2.16",
@@ -93,8 +93,8 @@
93
93
  "lodash-es": "^4.17.21",
94
94
  "vue": "3.2.25",
95
95
  "vue-router": "4.0.12",
96
- "@varlet/icons": "2.7.3-alpha.1675176726761",
97
- "@varlet/touch-emulator": "2.7.3-alpha.1675176726761"
96
+ "@varlet/icons": "2.7.3-alpha.1675236177820",
97
+ "@varlet/touch-emulator": "2.7.3-alpha.1675236177820"
98
98
  },
99
99
  "scripts": {
100
100
  "dev": "tsc --watch",