@maple-design/cli-vue 0.0.0-stage → 1.1.0

package/lib/client/index.js

@@ -0,0 +1,170 @@
+import { onMounted, onUnmounted, shallowRef } from 'vue';
+import config from '@config';
+import { ThemeProvider, Themes } from '@maple-design/ui-vue';
+import AppType from './appType';
+import { resolveDemoLanguage } from './language';
+import { currentTheme, observeTheme } from './theme-state';
+const themes = [
+    'lightTheme',
+    'darkTheme',
+    'mapleLightTheme',
+    'mapleDarkTheme',
+    'alpsLightTheme',
+    'fireflyLightTheme',
+    'alpsDarkTheme',
+    'fireflyDarkTheme',
+];
+function isTheme(value) {
+    return value !== null && themes.includes(value);
+}
+export function getPCLocationInfo() {
+    const [, language, path] = window.location.hash.split('/');
+    const [menuName, hash = ''] = path?.split('#') ?? [];
+    return {
+        language,
+        menuName,
+        hash,
+    };
+}
+function getHashSearch() {
+    const { href } = window.location;
+    const hashSearch = href.slice(href.indexOf('?'));
+    return new URLSearchParams(hashSearch);
+}
+function getSiteThemeKey() {
+    return config?.themeKey;
+}
+function getDemoThemeKey() {
+    return config?.demoThemeKey ?? `${getSiteThemeKey()}_DEMO`;
+}
+function getThemeStorageKey(scope) {
+    return scope === 'demo' ? getDemoThemeKey() : getSiteThemeKey();
+}
+function getPreferredTheme() {
+    const defaultLightTheme = config?.defaultLightTheme;
+    const defaultDarkTheme = config?.defaultDarkTheme;
+    return window.matchMedia?.('(prefers-color-scheme: dark)').matches ? defaultDarkTheme : defaultLightTheme;
+}
+/** Site docs chrome theme (`themeKey`) vs mobile demo theme (`demoThemeKey`). */
+export function getBrowserTheme(scope = 'site') {
+    const themeKey = getThemeStorageKey(scope);
+    const storageTheme = window.localStorage.getItem(themeKey);
+    if (isTheme(storageTheme)) {
+        return storageTheme;
+    }
+    // First visit for demo: seed from site theme so existing users keep the same look until they diverge.
+    if (scope === 'demo') {
+        const siteTheme = window.localStorage.getItem(getSiteThemeKey());
+        const theme = isTheme(siteTheme) ? siteTheme : getPreferredTheme();
+        window.localStorage.setItem(themeKey, theme);
+        return theme;
+    }
+    const theme = getPreferredTheme();
+    window.localStorage.setItem(themeKey, theme);
+    return theme;
+}
+export function persistTheme(theme, scope = 'site') {
+    window.localStorage.setItem(getThemeStorageKey(scope), theme);
+}
+export function watchLang(cb, platform) {
+    const handleHashchange = () => {
+        cb(resolveDemoLanguage(window.location.hash, platform));
+    };
+    useRouteListener(handleHashchange);
+    handleHashchange();
+}
+export function withSiteConfigNamespace(styleVars) {
+    return Object.entries(styleVars).reduce((styleVars, [key, value]) => {
+        styleVars[`--site-config-${key}`] = value;
+        return styleVars;
+    }, {});
+}
+export function watchPlatform(cb) {
+    const handleHashchange = () => {
+        const platform = getHashSearch().get('platform') ?? 'mobile';
+        cb(platform);
+    };
+    useRouteListener(handleHashchange);
+    handleHashchange();
+}
+export function useRouteListener(cb) {
+    onMounted(() => {
+        window.addEventListener('hashchange', cb);
+        window.addEventListener('popstate', cb);
+    });
+    onUnmounted(() => {
+        window.removeEventListener('hashchange', cb);
+        window.removeEventListener('popstate', cb);
+    });
+}
+export const currentThemePreset = shallowRef(Themes.default.light);
+export const currentStyleVars = shallowRef({});
+export { currentTheme } from './theme-state';
+const themeMap = {
+    lightTheme: Themes.default.light,
+    darkTheme: Themes.default.dark,
+    mapleLightTheme: Themes.maple.light,
+    mapleDarkTheme: Themes.maple.dark,
+    alpsLightTheme: Themes.alps.light,
+    fireflyLightTheme: Themes.firefly.light,
+    alpsDarkTheme: Themes.alps.dark,
+    fireflyDarkTheme: Themes.firefly.dark,
+};
+export function setTheme(theme) {
+    const siteStyleVars = withSiteConfigNamespace(config[theme] ||
+        (theme === 'alpsLightTheme' || theme === 'fireflyLightTheme'
+            ? config.lightTheme
+            : theme === 'alpsDarkTheme' || theme === 'fireflyDarkTheme'
+                ? config.darkTheme
+                : {}) ||
+        {});
+    currentThemePreset.value = themeMap[theme] ?? Themes.default.light;
+    currentStyleVars.value = siteStyleVars;
+    setColorScheme(theme);
+    currentTheme.value = theme;
+}
+export function onThemeChange(cb, scope = 'site') {
+    const theme = currentTheme.value ?? getBrowserTheme(scope);
+    setTheme(theme);
+    if (cb) {
+        observeTheme(cb);
+    }
+}
+export function getSiteStyleVars(theme) {
+    return withSiteConfigNamespace(config[theme] ||
+        (theme === 'alpsLightTheme' || theme === 'fireflyLightTheme'
+            ? config.lightTheme
+            : theme === 'alpsDarkTheme' || theme === 'fireflyDarkTheme'
+                ? config.darkTheme
+                : {}) ||
+        {});
+}
+export function setColorScheme(theme) {
+    document.documentElement.style.setProperty('color-scheme', theme.toLowerCase().includes('dark') ? 'dark' : 'light');
+}
+export function watchTheme(cb, shouldUnmount = true) {
+    const handleThemeChange = (event) => {
+        const { data } = event;
+        if (data?.action === 'theme-change') {
+            cb(data.data, data.from);
+        }
+    };
+    window.addEventListener('message', handleThemeChange);
+    if (shouldUnmount) {
+        onUnmounted(() => {
+            window.removeEventListener('message', handleThemeChange);
+        });
+    }
+    cb(getBrowserTheme('site'), 'default');
+}
+export function getMobileIndex() {
+    // Vite's dev server serves mobile.html from its root, even when the PC
+    // document was opened through a nested history-fallback URL.
+    if (import.meta.env.DEV) {
+        return '/mobile.html';
+    }
+    const isCf = config._cf.some((path) => window.location.origin.includes(path));
+    return isCf ? './mobile' : './mobile.html';
+}
+export { AppType, ThemeProvider };
+export { normalizeLanguage, getSavedLanguage, saveLanguage, createDemoMessages } from './language';

package/lib/client/language.d.ts

@@ -0,0 +1,11 @@
+export declare const siteLanguages: readonly ["zh-CN", "en-US"];
+export type SiteLanguage = (typeof siteLanguages)[number];
+export declare function normalizeLanguage(value: unknown, fallback?: SiteLanguage): SiteLanguage;
+export declare function getSavedLanguage(fallback?: SiteLanguage): SiteLanguage;
+export declare function saveLanguage(value: unknown): SiteLanguage;
+export declare function createDemoMessages(messages: Record<string, Record<string, string>>): {
+    use: (value: string) => void;
+    t: (key: string) => string;
+};
+/** Both the desktop docs route and the mobile demo route carry the site language. */
+export declare function resolveDemoLanguage(hash: string, platform?: 'pc' | 'mobile'): string;

package/lib/client/language.js

@@ -0,0 +1,52 @@
+import { computed, ref } from 'vue';
+export const siteLanguages = ['zh-CN', 'en-US'];
+const storageKey = 'maple-site-language';
+export function normalizeLanguage(value, fallback = 'zh-CN') {
+    return siteLanguages.includes(value) ? value : fallback;
+}
+export function getSavedLanguage(fallback = 'zh-CN') {
+    try {
+        return normalizeLanguage(window.localStorage.getItem(storageKey), fallback);
+    }
+    catch {
+        return fallback;
+    }
+}
+export function saveLanguage(value) {
+    const language = normalizeLanguage(value);
+    if (typeof document !== 'undefined') {
+        document.documentElement.lang = language;
+    }
+    try {
+        window.localStorage.setItem(storageKey, language);
+    }
+    catch {
+        /* Storage may be unavailable. */
+    }
+    return language;
+}
+// Demo titles are site metadata; demo SFCs do not need translation imports.
+export function createDemoMessages(messages) {
+    const language = ref('zh-CN');
+    const current = computed(() => messages[language.value] ?? messages['zh-CN'] ?? {});
+    return {
+        use: (value) => {
+            language.value = normalizeLanguage(value);
+        },
+        t: (key) => current.value[key] ?? messages['zh-CN']?.[key] ?? key,
+    };
+}
+/** Both the desktop docs route and the mobile demo route carry the site language. */
+export function resolveDemoLanguage(hash, platform) {
+    const queryIndex = hash.indexOf('?');
+    const query = new URLSearchParams(queryIndex < 0 ? '' : hash.slice(queryIndex + 1));
+    const [, routeLanguage, page] = hash.slice(0, queryIndex < 0 ? undefined : queryIndex).split('/');
+    if (platform === 'mobile') {
+        return query.get('language') || 'zh-CN';
+    }
+    if (platform === 'pc') {
+        return routeLanguage || 'zh-CN';
+    }
+    // Desktop: #/en-US/input; mobile/iframe: #/input?language=en-US.
+    return query.get('language') || (page ? routeLanguage : undefined) || 'zh-CN';
+}

package/lib/client/theme-state.d.ts

@@ -0,0 +1,3 @@
+import type { Theme } from './index';
+export declare const currentTheme: import("vue").ShallowRef<Theme | undefined, Theme | undefined>;
+export declare function observeTheme(callback: (theme: Theme) => void): import("vue").WatchHandle;

package/lib/client/theme-state.js

@@ -0,0 +1,6 @@
+import { shallowRef, watch } from 'vue';
+// The mounted app owns its theme; demos must not reapply another storage scope.
+export const currentTheme = shallowRef();
+export function observeTheme(callback) {
+    return watch(currentTheme, (theme) => theme && callback(theme), { immediate: true, flush: 'sync' });
+}

package/lib/node/bin.d.ts

@@ -0,0 +1,2 @@
+#!/usr/bin/env node
+export {};

package/lib/node/bin.js

@@ -0,0 +1,154 @@
+#!/usr/bin/env node
+import { Command } from 'commander';
+import { getCliVersion } from './shared/fsUtils.js';
+const program = new Command();
+program.version(`maple-cli ${getCliVersion()}`).usage('<command> [options]');
+program
+    .command('dev')
+    .option('-f --force', 'Force dep pre-optimization regardless of whether deps have changed')
+    .option('-d --draft', 'Start the service in draft mode')
+    .description('Run maple development environment')
+    .action(async (options) => {
+    const { dev } = await import('./commands/dev.js');
+    return dev(options);
+});
+program
+    .command('build')
+    .description('Build maple site for production')
+    .action(async () => {
+    const { build } = await import('./commands/build.js');
+    return build();
+});
+program
+    .command('dev:vite')
+    .description('Use vite start server for development')
+    .action(async () => {
+    const { vite } = await import('./commands/vite.js');
+    return vite('dev');
+});
+program
+    .command('build:vite')
+    .description('Use vite build app for production')
+    .action(async () => {
+    const { vite } = await import('./commands/vite.js');
+    return vite('build');
+});
+program
+    .command('dev:extension')
+    .description('Run VSCode extension development environment')
+    .action(async () => {
+    const { extension } = await import('./commands/extension.js');
+    return extension('dev');
+});
+program
+    .command('build:extension')
+    .description('Build VSCode extension for production')
+    .action(async () => {
+    const { extension } = await import('./commands/extension.js');
+    return extension('build');
+});
+program
+    .command('build:icons')
+    .option('-w --watch', 'Watch icons for changes and rebuild')
+    .description('Build icons')
+    .action(async (options) => {
+    const { icons } = await import('./commands/icons.js');
+    return icons(options);
+});
+program
+    .command('preview')
+    .description('Preview maple site for production')
+    .option('-p, --port <port>', 'port number')
+    .action(async (options) => {
+    const { preview } = await import('./commands/preview.js');
+    return preview(options);
+});
+program
+    .command('compile')
+    .description('Compile maple components library code')
+    .action(async () => {
+    const { compile } = await import('./commands/compile.js');
+    return compile();
+});
+program
+    .command('compile:style-vars')
+    .description('Compile maple style vars')
+    .action(async () => {
+    const { styleVars } = await import('./commands/styleVars.js');
+    return styleVars();
+});
+program
+    .command('create')
+    .description('Create a component directory')
+    .option('-i, --internal', 'maple internal mode')
+    .option('-n, --name <componentName>', 'Component name')
+    .option('-s, --sfc', 'Generate files in sfc format')
+    .option('-t, --tsx', 'Generate files in tsx format')
+    .option('-l, --locale', 'Generator internationalized files')
+    .action(async (options) => {
+    const { create } = await import('./commands/create.js');
+    return create(options);
+});
+program
+    .command('test')
+    .description('Run test in work directory')
+    .option('-w, --watch', 'Watch files for changes and rerun tests related to changed files')
+    .option('-c, --component <componentName>', 'Test a specific component')
+    .option('-cov, --coverage', 'Generate the coverage')
+    .action(async (options) => {
+    const { test } = await import('./commands/test.js');
+    return test(options);
+});
+program
+    .command('gen')
+    .description('Generate cli application')
+    .option('-n, --name <applicationName>', 'Application name')
+    .option('-s, --sfc', 'Generate files in sfc format')
+    .option('-t, --tsx', 'Generate files in tsx format')
+    .option('-l, --locale', 'Generator internationalized files')
+    .action(async (options) => {
+    const { gen } = await import('./commands/gen.js');
+    return gen(options);
+});
+program
+    .command('changelog')
+    .option('-rc --releaseCount <releaseCount>', 'Release count')
+    .option('-f --file <file>', 'Changelog filename')
+    .description('Generate changelog')
+    .action(async (options) => {
+    const { changelog } = await import('./release/index.js');
+    return changelog(options);
+});
+program
+    .command('release')
+    .option('-r --remote <remote>', 'Remote name')
+    .description('Release all packages and generate changelogs')
+    .action(async (options) => {
+    const { release } = await import('./release/index.js');
+    return release(options);
+});
+program
+    .command('commit-lint')
+    .option('-p --commitMessagePath <path>', 'Git commit message path')
+    .option('-r --commitMessageRe <reg>', 'Validate the regular of whether the commit message passes')
+    .option('-e --errorMessage <message>', 'Validation failed to display error messages')
+    .option('-w --warningMessage <message>', 'Validation failed to display warning messages')
+    .description('Lint commit message')
+    .action(async (options) => {
+    const { commitLint } = await import('./release/index.js');
+    return commitLint(options);
+});
+program
+    .command('checklist <gitParams>')
+    .description('Display a checklist for confirmation')
+    .action(async (options) => {
+    const { checklist } = await import('./commands/checklist.js');
+    return checklist(options);
+});
+program.on('command:*', async ([cmd]) => {
+    const { default: logger } = await import('./shared/logger.js');
+    program.outputHelp();
+    logger.error(`\nUnknown command ${cmd}.\n`);
+    process.exitCode = 1;
+});
+program.parse();

package/lib/node/commands/build.d.ts

@@ -0,0 +1 @@
+export declare function build(): Promise<void>;

package/lib/node/commands/build.js

@@ -0,0 +1,15 @@
+import fse from 'fs-extra';
+import { build as buildVite } from 'vite';
+import { buildSiteEntry } from '../compiler/compileSiteEntry.js';
+import { getMapleConfig } from '../config/maple.config.js';
+import { getBuildConfig } from '../config/vite.config.js';
+import { SRC_DIR } from '../shared/constant.js';
+const { ensureDirSync } = fse;
+export async function build() {
+    process.env.NODE_ENV = 'production';
+    ensureDirSync(SRC_DIR);
+    await buildSiteEntry(false);
+    const mapleConfig = await getMapleConfig();
+    const buildConfig = getBuildConfig(mapleConfig);
+    await buildVite(buildConfig);
+}

package/lib/node/commands/checklist.d.ts

@@ -0,0 +1,6 @@
+export interface CheckBlock {
+    type: string;
+    list: string[];
+}
+export declare function getCheckBlocks(html: string): CheckBlock[];
+export declare function checklist(gitParams: string): void;

package/lib/node/commands/checklist.js

@@ -0,0 +1,59 @@
+import fse from 'fs-extra';
+import markdownIt from 'markdown-it';
+import { COMMIT_MESSAGE_RE, getCommitMessage, isVersionCommitMessage } from '../release/index.js';
+import { CHECKLIST_FILE } from '../shared/constant.js';
+import logger from '../shared/logger.js';
+const { readFileSync, existsSync } = fse;
+const blockRE = /<h3>(.|\n|\r)+?<\/ul>/g;
+const typeRE = /<h3>(.+)<\/h3>/;
+const childrenRE = /<ul>(.|\n|\r)+<\/ul>/;
+const childRE = /<li>(.|\n|\r)+?<\/li>/g;
+export function getCheckBlocks(html) {
+    const blocks = html.match(blockRE) ?? [];
+    const checkBlocks = [];
+    blocks.forEach((block) => {
+        const type = block.match(typeRE)?.[1];
+        const childrenBlock = block.match(childrenRE)?.[0];
+        if (!type || !childrenBlock) {
+            return;
+        }
+        const children = childrenBlock.match(childRE);
+        if (!children) {
+            return;
+        }
+        const list = children.map((child) => child
+            .replaceAll('<li>', '')
+            .replaceAll('</li>', '')
+            .replaceAll('<p>', '')
+            .replaceAll('</p>', '')
+            .replaceAll('\n', ''));
+        checkBlocks.push({
+            type,
+            list,
+        });
+    });
+    return checkBlocks;
+}
+export function checklist(gitParams) {
+    const commitMessage = getCommitMessage(gitParams);
+    if (isVersionCommitMessage(commitMessage) || !existsSync(CHECKLIST_FILE)) {
+        return;
+    }
+    const content = readFileSync(CHECKLIST_FILE, 'utf-8');
+    const html = markdownIt().render(content);
+    const checkBlocks = getCheckBlocks(html);
+    if (!checkBlocks.length) {
+        logger.warning('Cannot find anything need to checked');
+        return;
+    }
+    const type = commitMessage.match(COMMIT_MESSAGE_RE)?.[1];
+    const typeChildren = checkBlocks.find((checkBlock) => checkBlock.type === type)?.list ?? [];
+    const commonChildren = checkBlocks.find((checkBlock) => checkBlock.type === 'common')?.list ?? [];
+    const list = [...commonChildren, ...typeChildren];
+    if (!list.length) {
+        return;
+    }
+    logger.title('\nIt is recommended that you check the following information before pushing:\n');
+    logger.warning(`${list.map((item) => `🔔 ${item}`).join('\n')}\n`);
+    logger.title('If there are changes that need to be amended, please use git commit --amend to resolve.');
+}

package/lib/node/commands/compile.d.ts

@@ -0,0 +1,3 @@
+export declare function removeDir(): Promise<[void, void, void, void]>;
+export declare function runTask(taskName: string, task: () => any): Promise<void>;
+export declare function compile(): Promise<void>;

package/lib/node/commands/compile.js

@@ -0,0 +1,41 @@
+import { resolve } from 'node:path';
+import { pathToFileURL } from 'node:url';
+import { buildLibrary } from '@sparknest/ui-build-vue';
+import fse from 'fs-extra';
+import { createSpinner } from 'nanospinner';
+import { compileTemplateHighlight } from '../compiler/compileTemplateHighlight.js';
+import { compileTypes, generateReference } from '../compiler/compileTypes.js';
+import { generateLibraryEntry } from '../compiler/generateLibraryEntry.js';
+import { ES_DIR, HL_DIR, LIB_DIR, UMD_DIR } from '../shared/constant.js';
+import logger from '../shared/logger.js';
+const { remove } = fse;
+export function removeDir() {
+    return Promise.all([remove(ES_DIR), remove(LIB_DIR), remove(HL_DIR), remove(UMD_DIR)]);
+}
+export async function runTask(taskName, task) {
+    const s = createSpinner().start({ text: `Compiling ${taskName}` });
+    try {
+        const start = performance.now();
+        await task();
+        s.success({ text: `Compilation ${taskName} completed! (${Math.ceil(performance.now() - start)}ms)` });
+    }
+    catch (e) {
+        s.error({ text: `Compilation ${taskName} failed!` });
+        logger.error(e.toString());
+        process.exitCode = 1;
+    }
+}
+export async function compile() {
+    process.env.NODE_ENV = 'production';
+    await removeDir();
+    await runTask('library entry', generateLibraryEntry);
+    await Promise.all([runTask('types', compileTypes), runTask('template highlight', compileTemplateHighlight)]);
+    const configUrl = pathToFileURL(resolve(process.cwd(), 'ui-build.config.mjs')).href;
+    const configModule = await import(`${configUrl}?t=${Date.now()}`);
+    await runTask('module', () => buildLibrary(configModule.default));
+    if (process.exitCode && process.exitCode !== 0) {
+        return;
+    }
+    generateReference(ES_DIR);
+    generateReference(LIB_DIR);
+}

package/lib/node/commands/create.d.ts

@@ -0,0 +1,8 @@
+export interface CreateCommandOptions {
+    internal?: boolean;
+    name?: string;
+    locale?: boolean;
+    sfc?: boolean;
+    tsx?: boolean;
+}
+export declare function create(options: CreateCommandOptions): Promise<void>;

package/lib/node/commands/create.js

@@ -0,0 +1,91 @@
+import { resolve } from 'path';
+import { confirm, input, select } from '@inquirer/prompts';
+import { camelize, kebabCase, pascalCase } from '@maple-design/shared-vue';
+import ejs from 'ejs';
+import fse from 'fs-extra';
+import { getMapleConfig } from '../config/maple.config.js';
+import { dirname, SRC_DIR } from '../shared/constant.js';
+import { glob } from '../shared/fsUtils.js';
+import logger from '../shared/logger.js';
+const { removeSync, readFileSync, copySync, pathExistsSync, writeFileSync, renameSync } = fse;
+async function renderTemplates(componentFolder, componentFolderName, renderData) {
+    const templates = await glob(`${componentFolder}/**/*.ejs`);
+    templates.forEach((template) => {
+        const templateCode = readFileSync(template, { encoding: 'utf-8' });
+        const code = ejs.render(templateCode, renderData);
+        const file = template
+            .replace('[componentName]', camelize(componentFolderName))
+            .replace('[ComponentName]', pascalCase(componentFolderName))
+            .replace('.ejs', '');
+        writeFileSync(file, code);
+        removeSync(template);
+    });
+}
+export async function create(options) {
+    logger.title('\n📦📦 Create a component ! \n');
+    const { namespace } = await getMapleConfig();
+    const renderData = {
+        namespace,
+        bigCamelizeNamespace: pascalCase(namespace),
+        kebabCaseName: 'component-name',
+        bigCamelizeName: 'ComponentName',
+        camelizeName: 'componentName',
+        style: 'vue',
+    };
+    const name = options.name
+        ? options.name
+        : await input({
+            message: 'Name of the component created: ',
+            default: renderData.kebabCaseName,
+        });
+    renderData.kebabCaseName = kebabCase(name);
+    renderData.camelizeName = camelize(name);
+    renderData.bigCamelizeName = pascalCase(name);
+    const componentFolder = resolve(SRC_DIR, renderData.kebabCaseName);
+    const componentFolderName = renderData.kebabCaseName;
+    if (pathExistsSync(componentFolder)) {
+        logger.warning(`${componentFolderName} already exist and cannot be recreated...`);
+        return;
+    }
+    const locale = options.locale
+        ? options.locale
+        : await confirm({
+            message: 'Whether to use i18n?',
+            default: false,
+        });
+    renderData.locale = locale;
+    // Determine whether the parameter carries a component style
+    if (options.sfc || options.tsx) {
+        renderData.style = options.sfc ? 'vue' : 'tsx';
+    }
+    else {
+        const style = await select({
+            message: 'Which style do you use to write your component ?',
+            choices: [
+                { name: 'sfc', value: 'vue' },
+                { name: 'tsx', value: 'tsx' },
+            ],
+            default: 'vue',
+        });
+        renderData.style = style;
+    }
+    copySync(resolve(dirname, '../../../template/create'), componentFolder);
+    await renderTemplates(componentFolder, componentFolderName, renderData);
+    if (options.internal) {
+        removeSync(resolve(componentFolder, './example/locale/index.ts'));
+        renameSync(resolve(componentFolder, './example/locale/_index.ts'), resolve(componentFolder, './example/locale/index.ts'));
+    }
+    else {
+        removeSync(resolve(componentFolder, './example/locale/_index.ts'));
+    }
+    if (!renderData.locale) {
+        removeSync(resolve(componentFolder, '/example/locale'));
+    }
+    if (renderData.style !== 'vue') {
+        removeSync(resolve(componentFolder, `${renderData.bigCamelizeName}.vue`));
+    }
+    if (renderData.style !== 'tsx') {
+        removeSync(resolve(componentFolder, `${renderData.bigCamelizeName}.tsx`));
+    }
+    logger.success(`Create ${componentFolderName} component success!`);
+}

package/lib/node/commands/dev.d.ts

@@ -0,0 +1,6 @@
+interface DevCommandOptions {
+    force?: boolean;
+    draft?: boolean;
+}
+export declare function dev(options: DevCommandOptions): Promise<void>;
+export {};