@varlet/cli 2.18.0 → 2.18.2-alpha.1698728560863

package/lib/node/commands/dev.js

@@ -2,23 +2,47 @@ import chokidar from 'chokidar';
 import fse from 'fs-extra';
 import logger from '../shared/logger.js';
 import { createServer } from 'vite';
-import { SRC_DIR, VARLET_CONFIG } from '../shared/constant.js';
+import { ES_DIR, SRC, SRC_DIR, VARLET_CONFIG } from '../shared/constant.js';
 import { buildSiteEntry } from '../compiler/compileSiteEntry.js';
 import { getDevConfig } from '../config/vite.config.js';
 import { getVarletConfig } from '../config/varlet.config.js';
-import { merge } from 'lodash-es';
-const { ensureDirSync, pathExistsSync } = fse;
+import { get, merge } from 'lodash-es';
+import { resolve } from 'path';
+import { generateEsEntryTemplate, getScriptExtname } from '../compiler/compileScript.js';
+import { getPublicDirs } from '../shared/fsUtils.js';
+import { kebabCase } from '@varlet/shared';
+const { ensureDirSync, pathExistsSync, readFileSync, outputFileSync, removeSync } = fse;
 let server;
 let watcher;
+async function stub(varletConfig) {
+    const name = kebabCase(get(varletConfig, 'name'));
+    // keep esm and css file for playground
+    const esmFile = resolve(ES_DIR, `${name}.esm.js`);
+    const cssFile = resolve(ES_DIR, `style.css`);
+    const esmContent = pathExistsSync(esmFile) ? readFileSync(esmFile, 'utf-8') : '';
+    const cssContent = pathExistsSync(cssFile) ? readFileSync(cssFile, 'utf-8') : '';
+    removeSync(ES_DIR);
+    const { indexTemplate } = generateEsEntryTemplate({
+        publicDirs: await getPublicDirs(),
+        root: `../${SRC}/`,
+        scriptExtname: '',
+    });
+    outputFileSync(resolve(ES_DIR, `index${getScriptExtname()}`), indexTemplate);
+    outputFileSync(resolve(ES_DIR, `style${getScriptExtname()}`), '');
+    outputFileSync(esmFile, esmContent);
+    outputFileSync(cssFile, cssContent);
+}
 async function startServer(options) {
+    const varletConfig = await getVarletConfig();
     const isRestart = Boolean(server);
     logger.info(`${isRestart ? 'Res' : 'S'}tarting server...`);
     // close all instance
     server && (await server.close());
     watcher && (await watcher.close());
+    // stub library index
+    await stub(varletConfig);
     // build all config
     await buildSiteEntry(options.draft ?? false);
-    const varletConfig = await getVarletConfig();
     const devConfig = getDevConfig(varletConfig);
     const inlineConfig = merge(devConfig, options.force ? { optimizeDeps: { force: true } } : {});
     // create all instance

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

@@ -12,4 +12,14 @@ export declare function compileScriptByEsbuild(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;
+export interface GenerateEsEntryTemplateOptions {
+    publicDirs: string[];
+    scriptExtname?: string;
+    root?: string;
+}
+export declare function generateEsEntryTemplate(options: GenerateEsEntryTemplateOptions): {
+    indexTemplate: string;
+    styleTemplate: string;
+    bundleTemplate: string;
+};
 export declare function compileESEntry(dir: string, publicDirs: string[]): Promise<void>;

package/lib/node/compiler/compileScript.js

@@ -124,21 +124,21 @@ export async function compileScriptFile(file) {
 export function getScriptExtname() {
     return '.mjs';
 }
-export async function compileESEntry(dir, publicDirs) {
+export function generateEsEntryTemplate(options) {
+    const { publicDirs, scriptExtname = getScriptExtname(), root = './' } = options;
     const imports = [];
     const plugins = [];
     const exports = [];
     const cssImports = [];
     const publicComponents = [];
-    const scriptExtname = getScriptExtname();
     publicDirs.forEach((dirname) => {
         const publicComponent = bigCamelize(dirname);
-        const module = `'./${dirname}/index${scriptExtname}'`;
+        const module = `'${root}${dirname}/index${scriptExtname}'`;
         publicComponents.push(publicComponent);
         imports.push(`import ${publicComponent} from ${module}`);
         exports.push(`export * from ${module}`);
         plugins.push(`${publicComponent}.install && app.use(${publicComponent})`);
-        cssImports.push(`import './${dirname}/style/index${scriptExtname}'`);
+        cssImports.push(`import '${root}${dirname}/style/index${scriptExtname}'`);
     });
     const install = `
 function install(app) {
@@ -184,6 +184,14 @@ export default {
   ${publicComponents.join(',\n  ')}
 }
 `;
+    return {
+        indexTemplate,
+        styleTemplate,
+        bundleTemplate,
+    };
+}
+export async function compileESEntry(dir, publicDirs) {
+    const { indexTemplate, bundleTemplate, styleTemplate } = generateEsEntryTemplate({ publicDirs });
     await Promise.all([
         writeFile(resolve(dir, 'index.mjs'), indexTemplate, 'utf-8'),
         writeFile(resolve(dir, 'index.bundle.mjs'), bundleTemplate, 'utf-8'),

package/lib/node/config/vite.config.d.ts

@@ -1,5 +1,5 @@
 import { InlineConfig } from 'vite';
-import { VarletConfig } from './varlet.config';
+import { VarletConfig } from './varlet.config.js';
 export declare function getDevConfig(varletConfig: Required<VarletConfig>): InlineConfig;
 export declare function getBuildConfig(varletConfig: Required<VarletConfig>): InlineConfig;
 export interface BundleBuildOptions {

package/lib/node/shared/constant.d.ts

@@ -2,6 +2,7 @@ export declare const dirname: string;
 export declare const CWD: string;
 export declare const VARLET_CONFIG: string;
 export declare const VITEST_CONFIG: string;
+export declare const SRC = "src";
 export declare const SRC_DIR: string;
 export declare const ES_DIR: string;
 export declare const LIB_DIR: string;

package/lib/node/shared/constant.js

@@ -4,7 +4,8 @@ export const dirname = getDirname(import.meta.url);
 export const CWD = process.cwd();
 export const VARLET_CONFIG = resolve(CWD, 'varlet.config.mjs');
 export const VITEST_CONFIG = resolve(dirname, '../config/vitest.config.js');
-export const SRC_DIR = resolve(CWD, 'src');
+export const SRC = 'src';
+export const SRC_DIR = resolve(CWD, SRC);
 export const ES_DIR = resolve(CWD, 'es');
 export const LIB_DIR = resolve(CWD, 'lib');
 export const UMD_DIR = resolve(CWD, 'umd');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/cli",
-  "version": "2.18.0",
+  "version": "2.18.2-alpha.1698728560863",
   "type": "module",
   "description": "cli of varlet",
   "bin": {
@@ -64,8 +64,8 @@
     "vite": "4.3.5",
     "vue": "3.3.4",
     "webfont": "^9.0.0",
-    "@varlet/shared": "2.18.0",
-    "@varlet/vite-plugins": "2.18.0"
+    "@varlet/shared": "2.18.2-alpha.1698728560863",
+    "@varlet/vite-plugins": "2.18.2-alpha.1698728560863"
   },
   "devDependencies": {
     "@types/babel__core": "^7.20.1",
@@ -80,9 +80,9 @@
     "@types/semver": "^7.3.9",
     "@types/sharp": "0.31.1",
     "rimraf": "^5.0.1",
-    "@varlet/ui": "2.18.0",
-    "@varlet/touch-emulator": "2.18.0",
-    "@varlet/icons": "2.18.0"
+    "@varlet/ui": "2.18.2-alpha.1698728560863",
+    "@varlet/icons": "2.18.2-alpha.1698728560863",
+    "@varlet/touch-emulator": "2.18.2-alpha.1698728560863"
   },
   "peerDependencies": {
     "@vue/runtime-core": "3.3.4",
@@ -95,9 +95,9 @@
     "lodash-es": "^4.17.21",
     "vue": "3.3.4",
     "vue-router": "4.2.0",
-    "@varlet/touch-emulator": "2.18.0",
-    "@varlet/ui": "2.18.0",
-    "@varlet/icons": "2.18.0"
+    "@varlet/ui": "2.18.2-alpha.1698728560863",
+    "@varlet/icons": "2.18.2-alpha.1698728560863",
+    "@varlet/touch-emulator": "2.18.2-alpha.1698728560863"
   },
   "scripts": {
     "dev": "tsc --watch",