@varlet/cli 2.7.0-alpha.1673640473187 → 2.7.0-alpha.1673714503631

package/README.en-US.md

@@ -61,7 +61,7 @@ Also refer to `@varlet/ui` [varlet.config.mjs](https://github.com/varletjs/varle
 If you want to insert other pages into the component library, you can create a `pages` folder in the project root directory to write a vue component to generate other pages.
 The directory structure is as follows:
 
-```js
+```text
 |-- varlet-ui
   |-- src
   |-- docs
@@ -77,7 +77,6 @@ The directory structure is as follows:
         |-- zh-CN.ts
         |-- en-US.ts
       |-- index.vue
-      
 ```
 
 The resulting route is as follows:
@@ -197,30 +196,3 @@ varlet-cli create
 
 - 1.`npm` repository registry must set to `npm` official mirror
 - 2.Execute `npm login` to log in
-
-### Module Compatible
-
-Some external dependencies may need to be compatible with module syntax to achieve the purpose of compiling correctly to `commonjs` and `esmodule`. For example, the wording of `esmodule` of `dayjs` is
-
-```js
-import dayjs from 'dayjs/esm'
-```
-
-In order to build `commonjs`, the writing method is
-
-```js
-import * as dayjs from 'dayjs'
-```
-
-In the project, we embrace the first way of writing the `esmodule` module, and make the following configuration for adaptation
-
-```js
-// varlet.config.mjs
-import { defineConfig } from '@varlet/cli'
-
-export default defineConfig({
-  moduleCompatible: {
-    "import dayjs from 'dayjs/esm'\n": "import * as dayjs from 'dayjs'\n"
-  }
-})
-```

package/README.md

@@ -59,7 +59,7 @@ varlet-cli gen
 如果想在组件库中插入其他页面，可以在项目根目录下的创建 `pages` 文件夹编写 vue 组件， 用来生成其他的页面。
 目录结构如下：
 
-```js
+```text
 |-- varlet-ui
   |-- src
   |-- docs
@@ -75,7 +75,6 @@ varlet-cli gen
         |-- zh-CN.ts
         |-- en-US.ts
       |-- index.vue
-      
 ```
 
 生成的路由如下：
@@ -194,31 +193,4 @@ varlet-cli create
 ### 发布前注意
 
 1. `npm` 的仓库源必须指向 `npm` 官方镜像
-2. 执行 `npm login` 进行登录
-
-### 模块适配对象
-
-一些外部依赖可能需要进行模块语法的适配，以达到可以正确编译到 `commonjs` 和 `esmodule` 的目的，例如 `dayjs` 的 `esmodule` 写法是
-
-```js
-import dayjs from 'dayjs/esm'
-```
-
-而为了构建 `commonjs` 时的写法是
-
-```js
-import * as dayjs from 'dayjs'
-```
-
-在项目中我们拥抱 `esmodule` 模块使用第一种写法，并做如下配置进行适配
-
-```js
-// varlet.config.mjs
-import { defineConfig } from '@varlet/cli'
-
-export default defineConfig({
-  moduleCompatible: {
-    "import dayjs from 'dayjs/esm'\n": "import * as dayjs from 'dayjs'\n"
-  }
-})
-```
+2. 执行 `npm login` 进行登录

package/lib/node/commands/compile.js

@@ -2,7 +2,7 @@ import ora from 'ora';
 import logger from '../shared/logger.js';
 import fse from 'fs-extra';
 import { ES_DIR, HL_DIR, LIB_DIR, UMD_DIR } from '../shared/constant.js';
-import { compileModule } from '../compiler/compileModule.js';
+import { compileBundle, compileModule } from '../compiler/compileModule.js';
 import { compileTemplateHighlight } from '../compiler/compileTemplateHighlight.js';
 import { compileTypes } from '../compiler/compileTypes.js';
 const { remove } = fse;
@@ -24,10 +24,8 @@ export async function compile() {
     process.env.NODE_ENV = 'compile';
     await removeDir();
     await Promise.all([runTask('types', compileTypes), runTask('template highlight', compileTemplateHighlight)]);
-    process.env.TARGET_MODULE = 'module';
     process.env.BABEL_MODULE = 'module';
     await runTask('module', compileModule);
     process.env.BABEL_MODULE = '';
-    process.env.TARGET_MODULE = 'bundle';
-    await runTask('bundle', compileModule);
+    await runTask('bundle', compileBundle);
 }

package/lib/node/compiler/compileModule.js

@@ -56,11 +56,6 @@ export async function compileFile(file) {
     isDir(file) && (await compileDir(file));
 }
 export async function compileModule() {
-    const targetModule = process.env.TARGET_MODULE;
-    if (targetModule === 'bundle') {
-        await compileBundle();
-        return;
-    }
     const dest = ES_DIR;
     await copy(SRC_DIR, dest);
     const moduleDir = await readdir(dest);

package/lib/node/compiler/compileSFC.js

@@ -68,9 +68,7 @@ export async function compileSFC(sfc) {
             });
             code = extractStyleDependencies(file, code, STYLE_IMPORT_RE);
             writeFileSync(file, clearEmptyLine(code), 'utf-8');
-            smartAppendFileSync(cssFile, process.env.TARGET_MODULE === 'commonjs'
-                ? `require('${dependencyPath}.css')\n`
-                : `import '${dependencyPath}.css'\n`);
+            smartAppendFileSync(cssFile, `import '${dependencyPath}.css'\n`);
             if (style.lang === 'less') {
                 await compileLess(file);
             }

package/lib/node/compiler/compileScript.d.ts

@@ -7,7 +7,6 @@ export declare const scriptIndexes: string[];
 export declare const styleIndexes: string[];
 export declare const tryMatchExtname: (file: string, extname: string[]) => string | undefined;
 export declare const resolveDependence: (file: string, script: string) => string;
-export declare const moduleCompatible: (script: string) => Promise<string>;
 export declare function compileScript(script: string, file: string): Promise<void>;
 export declare function compileScriptFile(file: string): Promise<void>;
 export declare function getScriptExtname(): string;

package/lib/node/compiler/compileScript.js

@@ -2,10 +2,8 @@ import fse from 'fs-extra';
 import { transformAsync } from '@babel/core';
 import { bigCamelize } from '@varlet/shared';
 import { getVersion, isDir, replaceExt } from '../shared/fsUtils.js';
-import { extractStyleDependencies, IMPORT_CSS_RE, IMPORT_LESS_RE, REQUIRE_CSS_RE, REQUIRE_LESS_RE, } from './compileStyle.js';
+import { extractStyleDependencies, IMPORT_CSS_RE, IMPORT_LESS_RE } from './compileStyle.js';
 import { resolve, extname, dirname } from 'path';
-import { get } from 'lodash-es';
-import { getVarletConfig } from '../config/varlet.config.js';
 const { writeFileSync, readdirSync, readFileSync, removeSync, writeFile, pathExistsSync } = fse;
 // https://regexr.com/765a4
 export const IMPORT_FROM_DEPENDENCE_RE = /import\s+?[\w\s{},$*]+\s+from\s+?(".*?"|'.*?')/g;
@@ -40,7 +38,7 @@ export const resolveDependence = (file, script) => {
         }
         if (ext) {
             if (scriptExtNames.includes(ext)) {
-                // e.g. './a.vue' -> './a.m?js'
+                // e.g. './a.vue' -> './a.mjs'
                 return done(dependence.replace(ext, scriptExtname));
             }
             if (styleExtNames.includes(ext)) {
@@ -49,7 +47,7 @@ export const resolveDependence = (file, script) => {
             }
         }
         if (!ext) {
-            // e.g. ../button/props -> ../button/props.m?js
+            // e.g. ../button/props -> ../button/props.mjs
             const matchedScript = tryMatchExtname(targetDependenceFile, scriptExtNames);
             if (matchedScript) {
                 return done(`${dependence}${scriptExtname}`);
@@ -64,7 +62,7 @@ export const resolveDependence = (file, script) => {
             const files = readdirSync(targetDependenceFile);
             const hasScriptIndex = files.some((file) => scriptIndexes.some((name) => file.endsWith(name)));
             if (hasScriptIndex) {
-                // e.g. -> ../button/index.m?js
+                // e.g. -> ../button/index.mjs
                 return done(`${dependence}/index${scriptExtname}`);
             }
             const hasStyleIndex = files.some((file) => styleIndexes.some((name) => file.endsWith(name)));
@@ -80,26 +78,14 @@ export const resolveDependence = (file, script) => {
         .replace(EXPORT_FROM_DEPENDENCE_RE, replacer)
         .replace(IMPORT_DEPENDENCE_RE, replacer);
 };
-export const moduleCompatible = async (script) => {
-    const moduleCompatible = get(await getVarletConfig(), 'moduleCompatible', {});
-    Object.keys(moduleCompatible).forEach((esm) => {
-        const commonjs = moduleCompatible[esm];
-        script = script.replace(esm, commonjs);
-    });
-    return script;
-};
 export async function compileScript(script, file) {
-    const targetModule = process.env.TARGET_MODULE;
-    if (targetModule === 'commonjs') {
-        script = await moduleCompatible(script);
-    }
     let { code } = (await transformAsync(script, {
         filename: file,
     }));
     if (code) {
         code = resolveDependence(file, code);
-        code = extractStyleDependencies(file, code, targetModule === 'commonjs' ? REQUIRE_CSS_RE : IMPORT_CSS_RE);
-        code = extractStyleDependencies(file, code, targetModule === 'commonjs' ? REQUIRE_LESS_RE : IMPORT_LESS_RE);
+        code = extractStyleDependencies(file, code, IMPORT_CSS_RE);
+        code = extractStyleDependencies(file, code, IMPORT_LESS_RE);
         removeSync(file);
         writeFileSync(replaceExt(file, getScriptExtname()), code, 'utf8');
     }

package/lib/node/compiler/compileStyle.d.ts

@@ -2,8 +2,6 @@ export declare const EMPTY_SPACE_RE: RegExp;
 export declare const EMPTY_LINE_RE: RegExp;
 export declare const IMPORT_CSS_RE: RegExp;
 export declare const IMPORT_LESS_RE: RegExp;
-export declare const REQUIRE_CSS_RE: RegExp;
-export declare const REQUIRE_LESS_RE: RegExp;
 export declare const STYLE_IMPORT_RE: RegExp;
 export declare const clearEmptyLine: (s: string) => string;
 export declare function normalizeStyleDependency(styleImport: string, reg: RegExp): string;

package/lib/node/compiler/compileStyle.js

@@ -10,8 +10,6 @@ export const EMPTY_SPACE_RE = /[\s]+/g;
 export const EMPTY_LINE_RE = /[\n\r]*/g;
 export const IMPORT_CSS_RE = /(?<!['"`])import\s+['"](\.{1,2}\/.+\.css)['"]\s*;?(?!\s*['"`])/g;
 export const IMPORT_LESS_RE = /(?<!['"`])import\s+['"](\.{1,2}\/.+\.less)['"]\s*;?(?!\s*['"`])/g;
-export const REQUIRE_CSS_RE = /(?<!['"`])require\(\s*['"](\.{1,2}\/.+\.css)['"]\s*\);?(?!\s*['"`])/g;
-export const REQUIRE_LESS_RE = /(?<!['"`])require\(\s*['"](\.{1,2}\/.+\.less)['"]\s*\);?(?!\s*['"`])/g;
 export const STYLE_IMPORT_RE = /@import\s+['"](.+)['"]\s*;/g;
 export const clearEmptyLine = (s) => s.replace(EMPTY_LINE_RE, '').replace(EMPTY_SPACE_RE, ' ');
 export function normalizeStyleDependency(styleImport, reg) {
@@ -26,10 +24,9 @@ export function extractStyleDependencies(file, code, styleReg) {
     var _a;
     const styleImports = (_a = code.match(styleReg)) !== null && _a !== void 0 ? _a : [];
     const cssFile = resolve(parse(file).dir, `./style/index${getScriptExtname()}`);
-    const targetModule = process.env.TARGET_MODULE;
     styleImports.forEach((styleImport) => {
         const normalizedPath = normalizeStyleDependency(styleImport, styleReg);
-        smartAppendFileSync(cssFile, targetModule === 'commonjs' ? `require('${normalizedPath}.css')\n` : `import '${normalizedPath}.css'\n`);
+        smartAppendFileSync(cssFile, `import '${normalizedPath}.css'\n`);
     });
     return code.replace(styleReg, '');
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/cli",
-  "version": "2.7.0-alpha.1673640473187",
+  "version": "2.7.0-alpha.1673714503631",
   "type": "module",
   "description": "cli of varlet",
   "bin": {
@@ -66,8 +66,8 @@
     "vite": "4.0.4",
     "vue": "3.2.25",
     "vue-jest": "^5.0.0-alpha.8",
-    "@varlet/vite-plugins": "2.7.0-alpha.1673640473187",
-    "@varlet/shared": "2.7.0-alpha.1673640473187"
+    "@varlet/vite-plugins": "2.7.0-alpha.1673714503631",
+    "@varlet/shared": "2.7.0-alpha.1673714503631"
   },
   "devDependencies": {
     "@types/babel__core": "^7.1.12",
@@ -79,8 +79,8 @@
     "@types/node": "^18.7.20",
     "@types/semver": "^7.3.9",
     "@types/inquirer": "^9.0.2",
-    "@varlet/touch-emulator": "2.7.0-alpha.1673640473187",
-    "@varlet/icons": "2.7.0-alpha.1673640473187"
+    "@varlet/icons": "2.7.0-alpha.1673714503631",
+    "@varlet/touch-emulator": "2.7.0-alpha.1673714503631"
   },
   "peerDependencies": {
     "@vue/runtime-core": "3.2.16",
@@ -90,8 +90,8 @@
     "lodash-es": "^4.17.21",
     "vue": "3.2.25",
     "vue-router": "4.0.12",
-    "@varlet/icons": "2.7.0-alpha.1673640473187",
-    "@varlet/touch-emulator": "2.7.0-alpha.1673640473187"
+    "@varlet/touch-emulator": "2.7.0-alpha.1673714503631",
+    "@varlet/icons": "2.7.0-alpha.1673714503631"
   },
   "scripts": {
     "dev": "tsc --watch",