@widget-js/cli 1.2.8 → 1.2.9-rc.3

package/lib/chunk-RAXJBANW.js

@@ -0,0 +1,45 @@
+// src/utils/PrettierUtils.ts
+import { format } from "prettier";
+var PrettierUtils = class {
+  static async format(code, parser) {
+    return format(code, {
+      parser,
+      tabWidth: 2,
+      singleQuote: true
+    });
+  }
+};
+
+// src/utils/EJSUtils.ts
+import path from "path";
+import fs from "fs";
+import ejs from "ejs";
+import { dirname } from "dirname-filename-esm";
+var EJSUtils = class {
+  static async renderToFile(templateFile, outputFile, parser, renderOptions) {
+    const defineTemplatePath = path.join(dirname(import.meta), "../template", templateFile);
+    let defineTemplate = fs.readFileSync(defineTemplatePath, "utf8");
+    let code = ejs.render(defineTemplate, renderOptions);
+    const formattedEJSCode = await PrettierUtils.format(code, parser);
+    fs.writeFileSync(outputFile, formattedEJSCode);
+  }
+};
+
+// src/utils/WidgetPackageUtils.ts
+import path2 from "path";
+import fs2 from "fs";
+var WidgetPackageUtils = class {
+  static getRootDir(widgetPackage) {
+    const widgetRootDir = path2.join(process.cwd(), widgetPackage.devOptions?.folder ?? "./src/widgets");
+    if (!fs2.existsSync(widgetRootDir)) {
+      fs2.mkdirSync(widgetRootDir, { recursive: true });
+    }
+    return widgetRootDir;
+  }
+};
+
+export {
+  PrettierUtils,
+  EJSUtils,
+  WidgetPackageUtils
+};

package/lib/{createWidget-SD5E5C5P.js → createWidget-UFW26NP6.js}

@@ -1,6 +1,7 @@
 import {
-  EJSUtils
-} from "./chunk-YHUBPHJK.js";
+  EJSUtils,
+  WidgetPackageUtils
+} from "./chunk-RAXJBANW.js";
 import {
   promptChecker_default
 } from "./chunk-3GPAHQ6O.js";
@@ -26,16 +27,11 @@ async function createWidget() {
     consola.error("widget.ts or widget.json not found");
     return;
   }
-  let widgetFolder = path.join(process.cwd(), "./src/widgets");
-  let devOptions = widgetPackage["devOptions"] ?? {};
-  if (devOptions["folder"]) {
-    widgetFolder = devOptions["folder"];
-    consola.info(`\u7EC4\u4EF6\u8DEF\u5F84\uFF1A${widgetFolder}`);
+  let widgetRootDir = WidgetPackageUtils.getRootDir(widgetPackage);
+  if (widgetPackage.devOptions && widgetPackage.devOptions.folder) {
+    consola.info(`\u7EC4\u4EF6\u8DEF\u5F84\uFF1A${widgetRootDir}`);
   } else {
-    consola.info(`\u6CA1\u6709\u914D\u7F6EdevOptions.folder\uFF0C\u4F7F\u7528\u9ED8\u8BA4\u8DEF\u5F84${widgetFolder}`);
-  }
-  if (!fs.existsSync(widgetFolder)) {
-    fs.mkdirSync(widgetFolder, { recursive: true });
+    consola.info(`\u6CA1\u6709\u914D\u7F6EdevOptions.folder\uFF0C\u4F7F\u7528\u9ED8\u8BA4\u8DEF\u5F84${widgetRootDir}`);
   }
   const getMiddleValue = (arr) => {
     if (arr.length === 1) {
@@ -130,7 +126,7 @@ async function createWidget() {
   const snakeCaseName = snakeCase(name);
   const paramCaseName = paramCase(name);
   const widgetName = widgetPackage.name + "." + snakeCaseName;
-  const widgetDir = path.join(widgetFolder, paramCaseName);
+  const widgetDir = path.join(widgetRootDir, paramCaseName);
   if (!fs.existsSync(widgetDir)) {
     fs.mkdirSync(widgetDir);
   } else {
@@ -164,14 +160,14 @@ async function createWidget() {
   const widgetFile = path.resolve(widgetDir, `${name}Widget.vue`);
   const widgetViewFile = path.resolve(widgetDir, `${name}WidgetView.vue`);
   const widgetRoutesFile = path.resolve(widgetDir, `${name}WidgetRoutes.ts`);
-  EJSUtils.renderToFile("WidgetDefine.ejs", widgetDefineFile, "typescript", renderOptions);
-  EJSUtils.renderToFile("WidgetView.ejs", widgetViewFile, "vue", renderOptions);
-  EJSUtils.renderToFile("WidgetRoutes.ejs", widgetRoutesFile, "typescript", renderOptions);
+  await EJSUtils.renderToFile("WidgetDefine.ejs", widgetDefineFile, "typescript", renderOptions);
+  await EJSUtils.renderToFile("WidgetView.ejs", widgetViewFile, "vue", renderOptions);
+  await EJSUtils.renderToFile("WidgetRoutes.ejs", widgetRoutesFile, "typescript", renderOptions);
   if (configurable) {
     const configFile = path.resolve(widgetDir, `${name}ConfigView.vue`);
-    EJSUtils.renderToFile("WidgetConfig.ejs", configFile, "vue", renderOptions);
+    await EJSUtils.renderToFile("WidgetConfig.ejs", configFile, "vue", renderOptions);
   }
-  const routeFile = path.join(widgetFolder, "widget-router.ts");
+  const routeFile = path.join(widgetRootDir, "widget-router.ts");
   let routeContent;
   if (fs.existsSync(routeFile)) {
     routeContent = fs.readFileSync(routeFile, "utf8");

package/lib/index.js

@@ -11,7 +11,7 @@ var cliPackage = JSON.parse(fs.readFileSync(packageJsonPath).toString());
 console.log(gradient.pastel.multiline(figlet.textSync("widget-cli", { horizontalLayout: "full" })));
 program.version(`@widget-js/cli ${cliPackage.version}`).usage("<command> [options]");
 program.command("create").description("Create new widget").action(async () => {
-  const createWidget = await import("./createWidget-SD5E5C5P.js");
+  const createWidget = await import("./createWidget-UFW26NP6.js");
   await createWidget.default();
 });
 var dependenciesOption = new Option("-t, --type <type>").choices(["remote", "local"]);
@@ -20,7 +20,7 @@ program.command("dependencies").description("Set @widget-js dependencies to loca
   await dependencies.default(options);
 });
 program.command("init").description("Initialize widget-js project").action(async () => {
-  const init = await import("./init-AO2J5DEO.js");
+  const init = await import("./init-QWD6RW77.js");
   await init.init();
 });
 var typeOption = new Option("-t, --type <type>").choices(["ftp", "oss"]);

package/lib/{init-AO2J5DEO.js → init-QWD6RW77.js}

@@ -1,7 +1,8 @@
 import {
   EJSUtils,
-  PrettierUtils
-} from "./chunk-YHUBPHJK.js";
+  PrettierUtils,
+  WidgetPackageUtils
+} from "./chunk-RAXJBANW.js";
 import {
   promptChecker_default
 } from "./chunk-3GPAHQ6O.js";
@@ -16,6 +17,7 @@ import fs from "fs";
 import consola from "consola";
 import chalk from "chalk";
 import ora from "ora";
+import { scanWidgetPackage } from "@widget-js/utils";
 var spinner = ora("Loading");
 async function init() {
   await addDependencies();
@@ -26,24 +28,27 @@ async function addWidgetTs() {
     {
       type: "input",
       name: "name",
-      message: chalk.blue("\u7EC4\u4EF6\u5305\u540D \uFF08\u793A\u4F8B cn.widget.countdown\uFF09\uFF1A")
+      message: chalk.blue("\u7EC4\u4EF6\u5305 \u5305\u540D \uFF08\u793A\u4F8B cn.widget.countdown\uFF09\uFF1A")
     },
     (answer) => {
       const name2 = answer.name;
       if (name2 == null || name2 === "") {
-        consola.log(chalk.red(`\u7EC4\u4EF6\u5305\u540D\u4E0D\u80FD\u4E3A\u7A7A`));
+        consola.log(chalk.red(`\u5305\u540D\u4E0D\u80FD\u4E3A\u7A7A`));
         return false;
       }
       return true;
     }
   );
-  let widgetTs = path.join(process.cwd(), "widget.package.ts");
-  if (!fs.existsSync(widgetTs)) {
-    spinner.info("creating widget.package.ts");
-    EJSUtils.renderToFile("WidgetPackage.ejs", widgetTs, "typescript", { name });
+  let widgetPackageTs = path.join(process.cwd(), "widget.package.ts");
+  if (fs.existsSync(widgetPackageTs)) {
+    spinner.info("widget.package.ts\u5DF2\u5B58\u5728\uFF0C\u8DF3\u8FC7");
+  } else {
+    spinner.info("\u521B\u5EFA widget.package.ts");
+    await EJSUtils.renderToFile("WidgetPackage.ejs", widgetPackageTs, "typescript", { name });
   }
-  addVitePlugin();
-  spinner.succeed("Done! Be sure to replace the contents of widget.package.ts with your own.");
+  await addVitePlugin();
+  await createRouter();
+  spinner.succeed("\u5B8C\u6210! \u8BB0\u5F97\u4FEE\u6539widget.package.ts\u3002");
 }
 async function addDependencies() {
   spinner.info("Adding dependencies");
@@ -64,17 +69,38 @@ async function addDependencies() {
   fs.writeFileSync(Utils.getPackagePath(), JSON.stringify(packageJson, null, 2));
 }
 async function addVitePlugin() {
-  spinner.info("Adding vite plugin");
+  spinner.info("\u6DFB\u52A0 vite-plugin-widget \u5230 vite plugin");
   const viteConfigPath = path.join(process.cwd(), "vite.config.ts");
   if (!fs.existsSync(viteConfigPath)) {
     spinner.warn("vite.config.ts not exists");
     return;
   }
   let viteConfig = fs.readFileSync(viteConfigPath).toString();
-  viteConfig = viteConfig.replace("import", `import widget from '@widget-js/vite-plugin-widget'
-import`);
+  viteConfig = `import widget from '@widget-js/vite-plugin-widget'
+` + viteConfig;
   viteConfig = viteConfig.replace("vue()", `vue(),widget()`);
-  fs.writeFileSync(viteConfigPath, PrettierUtils.format(viteConfig, "typescript"));
+  fs.writeFileSync(viteConfigPath, await PrettierUtils.format(viteConfig, "typescript"));
+}
+async function createRouter() {
+  const widgetPackage = await scanWidgetPackage();
+  if (widgetPackage) {
+    spinner.info("\u521B\u5EFA widget-router.ts");
+    const rootDir = WidgetPackageUtils.getRootDir(widgetPackage);
+    const widgetRouterPath = path.join(rootDir, "widget-router.ts");
+    const routerContent = fs.readFileSync(path.join(__dirname, "../template/widget-router.ts"), "utf8");
+    fs.writeFileSync(widgetRouterPath, routerContent);
+    const vueRouterPath = path.join(process.cwd(), "./router/index.ts");
+    spinner.info("\u4FEE\u6539VueRouter\u914D\u7F6E");
+    if (fs.existsSync(vueRouterPath)) {
+      let vueRouterContent = fs.readFileSync(vueRouterPath, "utf8");
+      const importStr = `import WidgetRouter from "../widgets/widget-router";`;
+      vueRouterContent = `${importStr}
+${vueRouterContent}`;
+      vueRouterContent.replace("routes: [", `routes: [
+...WidgetRouter,`);
+      fs.writeFileSync(vueRouterPath, await PrettierUtils.format(vueRouterContent, "typescript"));
+    }
+  }
 }
 async function addDependency(packageName, dependencies) {
   spinner.info(`Adding dependencies ${packageName}`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@widget-js/cli",
-  "version": "1.2.8",
+  "version": "1.2.9-rc.3",
   "main": "lib/index.js",
   "author": "Neo Fu",
   "license": "MIT",
@@ -34,12 +34,13 @@
     "minimatch": "^9.0.3",
     "ora": "^6.2.0",
     "package-json": "^8.1.0",
-    "prettier": "^2.8.8",
+    "prettier": "^3.1.1",
     "semver": "^7.3.8",
     "shelljs": "^0.8.5",
     "ssh2-sftp-client": "^9.1.0",
     "ws": "^8.11.0",
     "@widget-js/core": "^0.11.20",
+    "@widget-js/vue3": "^0.11.20",
     "@widget-js/utils": "0.10.21"
   },
   "devDependencies": {

package/src/createWidget.ts

@@ -1,232 +1,227 @@
-import path from 'path'
-import fs from 'fs'
-import consola from 'consola'
-import promptChecker from './promts/promptChecker'
-import {paramCase, snakeCase} from 'change-case'
-import inquirer from 'inquirer'
-import shell from 'shelljs'
-import exit from './utils.js'
-import chalk from 'chalk'
-import {scanWidgetPackage} from '@widget-js/utils'
-import {fileURLToPath} from 'url'
-import {EJSUtils} from "./utils/EJSUtils";
-// import vm from "vm";
-const __filename = fileURLToPath(import.meta.url)
-
-const __dirname = path.dirname(__filename)
-
-interface RenderOptions {
-  name: string
-  snakeCaseName: string
-  paramCaseName: string
-  packageName: string
-  widgetName: string
-  title: string
-  configurable: string
-  width: number
-  height: number
-  maxWidth: number
-  minHeight: number
-  maxHeight: number
-  minWidth: number
-}
-
-export default async function createWidget() {
-  let widgetPackage = await scanWidgetPackage()
-  if (!widgetPackage) {
-    consola.error('widget.ts or widget.json not found')
-    return
-  }
-  let widgetFolder = path.join(process.cwd(), './src/widgets')
-  let devOptions = widgetPackage['devOptions'] ?? {}
-  if (devOptions['folder']) {
-    widgetFolder = devOptions['folder']
-    consola.info(`组件路径：${widgetFolder}`)
-  } else {
-    consola.info(`没有配置devOptions.folder，使用默认路径${widgetFolder}`)
-  }
-
-  if (!fs.existsSync(widgetFolder)) {
-    fs.mkdirSync(widgetFolder, {recursive: true})
-  }
-
-  const getMiddleValue = (arr: number[]) => {
-    if (arr.length === 1) {
-      return arr[0]
-    } else if (arr.length === 2) {
-      return Math.max(...arr)
-    } else {
-      const max = Math.max(...arr)
-      const min = Math.min(...arr)
-      const sum = arr[0] + arr[1] + arr[2]
-      return sum - max - min
-    }
-  }
-
-  let name = await promptChecker(
-    {
-      type: 'input',
-      name: 'name',
-      message: chalk.blue('请输入组件名(大驼峰式)，如：CountdownClock'),
-    },
-    answer => {
-      const name = answer.name
-      if (name == null || name === '') {
-        consola.log(chalk.red('组件名不能为空'))
-        return false
-      }
-      return true
-    },
-  )
-
-  consola.log(chalk.green(name))
-
-  let title = await promptChecker({
-    type: 'input',
-    name: 'title',
-    message: chalk.blue('请输入组件标题，如：倒计时'),
-  })
-  consola.log(chalk.green(title))
-  let answerW = await promptChecker(
-    {
-      type: 'checkbox',
-      name: 'w',
-      message: chalk.blue(
-        '请选择组件宽度，最多选3个，例如选中2,4,6，代表组件最小宽为2，默认宽为4，最大宽为6，单选代表不可拉伸',
-      ),
-      choices: [1, 2, 3, 4, 5, 6],
-    },
-    answer => {
-      if (answer.w.length === 0) {
-        consola.log(chalk.red('宽度必须选择'))
-        return false
-      }
-
-      if (answer.w.length > 3) {
-        consola.log(chalk.red('宽度最多选择3个'))
-        return false
-      }
-      return true
-    },
-  )
-  consola.log(chalk.green(answerW))
-
-  let answerH = await promptChecker(
-    {
-      type: 'checkbox',
-      name: 'h',
-      message: chalk.blue(
-        '请选择组件高度，最多选3个，例如选中1,2，代表组件最小高为1，默认高为2，最大高为2，单选代表不可拉伸',
-      ),
-      choices: [1, 2, 3, 4, 5, 6],
-    },
-    answer => {
-      if (answer.h.length === 0) {
-        consola.log(chalk.red('高度必须选择'))
-        return false
-      }
-
-      if (answer.h.length > 3) {
-        consola.log(chalk.red('高度最多选择3个'))
-        return false
-      }
-      return true
-    },
-  )
-
-  consola.log(chalk.green(answerH))
-
-  let configurable = await promptChecker({
-    type: 'confirm',
-    name: 'configurable',
-    message: chalk.blue('组件是否可配置，例如修改背景颜色，字体大小等'),
-  })
-
-  consola.log(chalk.green(configurable))
-
-  const width = getMiddleValue(answerW)
-  const height = getMiddleValue(answerH)
-  const minWidth = Math.min(...answerW)
-  const maxWidth = Math.max(...answerW)
-  const minHeight = Math.min(...answerH)
-  const maxHeight = Math.max(...answerH)
-  const snakeCaseName = snakeCase(name)
-  const paramCaseName = paramCase(name)
-
-  const widgetName = widgetPackage.name + '.' + snakeCaseName
-
-  const widgetDir = path.join(widgetFolder, paramCaseName)
-  if (!fs.existsSync(widgetDir)) {
-    fs.mkdirSync(widgetDir)
-  } else {
-    let answer = await inquirer.prompt([
-      {
-        type: 'confirm',
-        name: 'override',
-        message: chalk.red('组件名已存在，是否继续?'),
-      },
-    ])
-    if (!answer.override) {
-      exit()
-    }
-  }
-
-  const renderOptions: RenderOptions = {
-    name: name,
-    snakeCaseName: snakeCaseName,
-    paramCaseName: paramCaseName,
-    packageName: widgetPackage.name,
-    widgetName: widgetName,
-    title: title,
-    configurable: configurable,
-    width: width,
-    height: height,
-    maxWidth: maxWidth,
-    minHeight: minHeight,
-    maxHeight: maxHeight,
-    minWidth: minWidth,
-  }
-
-  const widgetDefineFile = path.resolve(widgetDir, `${name}.widget.ts`)
-  const widgetFile = path.resolve(widgetDir, `${name}Widget.vue`)
-  const widgetViewFile = path.resolve(widgetDir, `${name}WidgetView.vue`)
-  const widgetRoutesFile = path.resolve(widgetDir, `${name}WidgetRoutes.ts`)
-
-  EJSUtils.renderToFile('WidgetDefine.ejs', widgetDefineFile, 'typescript', renderOptions)
-  // EJSUtils.renderToFile('Widget.ejs', widgetFile, 'vue', renderOptions)
-  EJSUtils.renderToFile('WidgetView.ejs', widgetViewFile, 'vue', renderOptions)
-  EJSUtils.renderToFile('WidgetRoutes.ejs', widgetRoutesFile, 'typescript', renderOptions)
-  if (configurable) {
-    const configFile = path.resolve(widgetDir, `${name}ConfigView.vue`)
-    EJSUtils.renderToFile('WidgetConfig.ejs', configFile, 'vue', renderOptions)
-  }
-  // 注册路由
-  const routeFile = path.join(widgetFolder, 'widget-router.ts')
-  let routeContent
-  if (fs.existsSync(routeFile)) {
-    routeContent = fs.readFileSync(routeFile, 'utf8')
-  } else {
-    routeContent = fs.readFileSync(path.join(__dirname, '../template/widget-router.ts'), 'utf8')
-  }
-  const importRouteStr = `import ${name}WidgetRoutes from "./${paramCaseName}/${name}WidgetRoutes";`
-  const routeStr = `...${name}WidgetRoutes,`
-  if (!routeContent.includes(importRouteStr)) {
-    routeContent = routeContent.replaceAll(
-      '//FBI WANING! IMPORT PLACE',
-      `${importRouteStr}\n//FBI WANING! IMPORT PLACE`,
-    )
-  }
-  if (!routeContent.includes(routeStr)) {
-    routeContent = routeContent.replaceAll('//FBI WANING! ROUTE PLACE', `${routeStr}\n    //FBI WANING! ROUTE PLACE`)
-  }
-
-  fs.writeFileSync(routeFile, routeContent)
-
-  //添加到版本控制
-  let gitAdd = `git add ${widgetDir}`
-  consola.info(chalk.grey(gitAdd))
-  shell.exec(gitAdd)
-  consola.log('=================')
-  consola.info(`已创建组件：${widgetDir}`)
-  consola.success('Happy coding!')
-}
+import path from 'path'
+import fs from 'fs'
+import consola from 'consola'
+import promptChecker from './promts/promptChecker'
+import {paramCase, snakeCase} from 'change-case'
+import inquirer from 'inquirer'
+import shell from 'shelljs'
+import exit from './utils.js'
+import chalk from 'chalk'
+import {scanWidgetPackage} from '@widget-js/utils'
+import {fileURLToPath} from 'url'
+import {EJSUtils} from './utils/EJSUtils'
+import {WidgetPackageUtils} from "./utils/WidgetPackageUtils";
+// import vm from "vm";
+const __filename = fileURLToPath(import.meta.url)
+
+const __dirname = path.dirname(__filename)
+
+interface RenderOptions {
+  name: string
+  snakeCaseName: string
+  paramCaseName: string
+  packageName: string
+  widgetName: string
+  title: string
+  configurable: string
+  width: number
+  height: number
+  maxWidth: number
+  minHeight: number
+  maxHeight: number
+  minWidth: number
+}
+
+export default async function createWidget() {
+  let widgetPackage = await scanWidgetPackage()
+  if (!widgetPackage) {
+    consola.error('widget.ts or widget.json not found')
+    return
+  }
+  let widgetRootDir = WidgetPackageUtils.getRootDir(widgetPackage);
+  if (widgetPackage.devOptions && widgetPackage.devOptions.folder) {
+    consola.info(`组件路径：${widgetRootDir}`)
+  } else {
+    consola.info(`没有配置devOptions.folder，使用默认路径${widgetRootDir}`)
+  }
+
+  const getMiddleValue = (arr: number[]) => {
+    if (arr.length === 1) {
+      return arr[0]
+    } else if (arr.length === 2) {
+      return Math.max(...arr)
+    } else {
+      const max = Math.max(...arr)
+      const min = Math.min(...arr)
+      const sum = arr[0] + arr[1] + arr[2]
+      return sum - max - min
+    }
+  }
+
+  let name = await promptChecker(
+    {
+      type: 'input',
+      name: 'name',
+      message: chalk.blue('请输入组件名(大驼峰式)，如：CountdownClock'),
+    },
+    answer => {
+      const name = answer.name
+      if (name == null || name === '') {
+        consola.log(chalk.red('组件名不能为空'))
+        return false
+      }
+      return true
+    },
+  )
+
+  consola.log(chalk.green(name))
+
+  let title = await promptChecker({
+    type: 'input',
+    name: 'title',
+    message: chalk.blue('请输入组件标题，如：倒计时'),
+  })
+  consola.log(chalk.green(title))
+  let answerW = await promptChecker(
+    {
+      type: 'checkbox',
+      name: 'w',
+      message: chalk.blue(
+        '请选择组件宽度，最多选3个，例如选中2,4,6，代表组件最小宽为2，默认宽为4，最大宽为6，单选代表不可拉伸',
+      ),
+      choices: [1, 2, 3, 4, 5, 6],
+    },
+    answer => {
+      if (answer.w.length === 0) {
+        consola.log(chalk.red('宽度必须选择'))
+        return false
+      }
+
+      if (answer.w.length > 3) {
+        consola.log(chalk.red('宽度最多选择3个'))
+        return false
+      }
+      return true
+    },
+  )
+  consola.log(chalk.green(answerW))
+
+  let answerH = await promptChecker(
+    {
+      type: 'checkbox',
+      name: 'h',
+      message: chalk.blue(
+        '请选择组件高度，最多选3个，例如选中1,2，代表组件最小高为1，默认高为2，最大高为2，单选代表不可拉伸',
+      ),
+      choices: [1, 2, 3, 4, 5, 6],
+    },
+    answer => {
+      if (answer.h.length === 0) {
+        consola.log(chalk.red('高度必须选择'))
+        return false
+      }
+
+      if (answer.h.length > 3) {
+        consola.log(chalk.red('高度最多选择3个'))
+        return false
+      }
+      return true
+    },
+  )
+
+  consola.log(chalk.green(answerH))
+
+  let configurable = await promptChecker({
+    type: 'confirm',
+    name: 'configurable',
+    message: chalk.blue('组件是否可配置，例如修改背景颜色，字体大小等'),
+  })
+
+  consola.log(chalk.green(configurable))
+
+  const width = getMiddleValue(answerW)
+  const height = getMiddleValue(answerH)
+  const minWidth = Math.min(...answerW)
+  const maxWidth = Math.max(...answerW)
+  const minHeight = Math.min(...answerH)
+  const maxHeight = Math.max(...answerH)
+  const snakeCaseName = snakeCase(name)
+  const paramCaseName = paramCase(name)
+
+  const widgetName = widgetPackage.name + '.' + snakeCaseName
+
+  const widgetDir = path.join(widgetRootDir, paramCaseName)
+  if (!fs.existsSync(widgetDir)) {
+    fs.mkdirSync(widgetDir)
+  } else {
+    let answer = await inquirer.prompt([
+      {
+        type: 'confirm',
+        name: 'override',
+        message: chalk.red('组件名已存在，是否继续?'),
+      },
+    ])
+    if (!answer.override) {
+      exit()
+    }
+  }
+
+  const renderOptions: RenderOptions = {
+    name: name,
+    snakeCaseName: snakeCaseName,
+    paramCaseName: paramCaseName,
+    packageName: widgetPackage.name,
+    widgetName: widgetName,
+    title: title,
+    configurable: configurable,
+    width: width,
+    height: height,
+    maxWidth: maxWidth,
+    minHeight: minHeight,
+    maxHeight: maxHeight,
+    minWidth: minWidth,
+  }
+
+  const widgetDefineFile = path.resolve(widgetDir, `${name}.widget.ts`)
+  const widgetFile = path.resolve(widgetDir, `${name}Widget.vue`)
+  const widgetViewFile = path.resolve(widgetDir, `${name}WidgetView.vue`)
+  const widgetRoutesFile = path.resolve(widgetDir, `${name}WidgetRoutes.ts`)
+
+  await EJSUtils.renderToFile('WidgetDefine.ejs', widgetDefineFile, 'typescript', renderOptions)
+  // EJSUtils.renderToFile('Widget.ejs', widgetFile, 'vue', renderOptions)
+  await EJSUtils.renderToFile('WidgetView.ejs', widgetViewFile, 'vue', renderOptions)
+  await EJSUtils.renderToFile('WidgetRoutes.ejs', widgetRoutesFile, 'typescript', renderOptions)
+  if (configurable) {
+    const configFile = path.resolve(widgetDir, `${name}ConfigView.vue`)
+    await EJSUtils.renderToFile('WidgetConfig.ejs', configFile, 'vue', renderOptions)
+  }
+  // 注册路由
+  const routeFile = path.join(widgetRootDir, 'widget-router.ts')
+  let routeContent
+  if (fs.existsSync(routeFile)) {
+    routeContent = fs.readFileSync(routeFile, 'utf8')
+  } else {
+    routeContent = fs.readFileSync(path.join(__dirname, '../template/widget-router.ts'), 'utf8')
+  }
+  const importRouteStr = `import ${name}WidgetRoutes from "./${paramCaseName}/${name}WidgetRoutes";`
+  const routeStr = `...${name}WidgetRoutes,`
+  if (!routeContent.includes(importRouteStr)) {
+    routeContent = routeContent.replaceAll(
+      '//FBI WANING! IMPORT PLACE',
+      `${importRouteStr}\n//FBI WANING! IMPORT PLACE`,
+    )
+  }
+  if (!routeContent.includes(routeStr)) {
+    routeContent = routeContent.replaceAll('//FBI WANING! ROUTE PLACE', `${routeStr}\n    //FBI WANING! ROUTE PLACE`)
+  }
+
+  fs.writeFileSync(routeFile, routeContent)
+
+  //添加到版本控制
+  let gitAdd = `git add ${widgetDir}`
+  consola.info(chalk.grey(gitAdd))
+  shell.exec(gitAdd)
+  consola.log('=================')
+  consola.info(`已创建组件：${widgetDir}`)
+  consola.success('Happy coding!')
+}

package/src/init/init.ts

@@ -7,8 +7,9 @@ import promptChecker from '../promts/promptChecker'
 import chalk from 'chalk'
 import {EJSUtils} from '../utils/EJSUtils'
 import ora from 'ora'
-import {vi} from 'vitest'
 import {PrettierUtils} from '../utils/PrettierUtils'
+import {scanWidgetPackage} from '@widget-js/utils'
+import {WidgetPackageUtils} from '../utils/WidgetPackageUtils'
 
 const spinner = ora('Loading')
 
@@ -22,27 +23,30 @@ async function addWidgetTs() {
     {
       type: 'input',
       name: 'name',
-      message: chalk.blue('组件包名 （示例 cn.widget.countdown）：'),
+      message: chalk.blue('组件包 包名 （示例 cn.widget.countdown）：'),
     },
     answer => {
       const name = answer.name
       if (name == null || name === '') {
-        consola.log(chalk.red(`组件包名不能为空`))
+        consola.log(chalk.red(`包名不能为空`))
         return false
       }
       return true
     },
   )
 
-  let widgetTs = path.join(process.cwd(), 'widget.package.ts')
-  if (!fs.existsSync(widgetTs)) {
-    spinner.info('creating widget.package.ts')
-    EJSUtils.renderToFile('WidgetPackage.ejs', widgetTs, 'typescript', {name})
+  let widgetPackageTs = path.join(process.cwd(), 'widget.package.ts')
+  if (fs.existsSync(widgetPackageTs)) {
+    spinner.info('widget.package.ts已存在，跳过')
+  } else {
+    spinner.info('创建 widget.package.ts')
+    await EJSUtils.renderToFile('WidgetPackage.ejs', widgetPackageTs, 'typescript', {name})
   }
 
-  addVitePlugin()
+  await addVitePlugin()
+  await createRouter()
 
-  spinner.succeed('Done! Be sure to replace the contents of widget.package.ts with your own.')
+  spinner.succeed('完成! 记得修改widget.package.ts。')
 }
 
 /**
@@ -71,16 +75,37 @@ async function addDependencies() {
 }
 
 async function addVitePlugin() {
-  spinner.info('Adding vite plugin')
+  spinner.info('添加 vite-plugin-widget 到 vite plugin')
   const viteConfigPath = path.join(process.cwd(), 'vite.config.ts')
   if (!fs.existsSync(viteConfigPath)) {
     spinner.warn('vite.config.ts not exists')
     return
   }
   let viteConfig = fs.readFileSync(viteConfigPath).toString()
-  viteConfig = viteConfig.replace('import', `import widget from '@widget-js/vite-plugin-widget'\nimport`)
+  viteConfig = `import widget from '@widget-js/vite-plugin-widget'\n` + viteConfig
   viteConfig = viteConfig.replace('vue()', `vue(),widget()`)
-  fs.writeFileSync(viteConfigPath, PrettierUtils.format(viteConfig, 'typescript'))
+  fs.writeFileSync(viteConfigPath, await PrettierUtils.format(viteConfig, 'typescript'))
+}
+
+async function createRouter() {
+  const widgetPackage = await scanWidgetPackage()
+  if (widgetPackage) {
+    spinner.info('创建 widget-router.ts')
+    const rootDir = WidgetPackageUtils.getRootDir(widgetPackage)
+    const widgetRouterPath = path.join(rootDir, 'widget-router.ts')
+    const routerContent = fs.readFileSync(path.join(__dirname, '../template/widget-router.ts'), 'utf8')
+    fs.writeFileSync(widgetRouterPath, routerContent)
+
+    const vueRouterPath = path.join(process.cwd(), './router/index.ts')
+    spinner.info('修改VueRouter配置')
+    if (fs.existsSync(vueRouterPath)) {
+      let vueRouterContent = fs.readFileSync(vueRouterPath, 'utf8')
+      const importStr = `import WidgetRouter from "../widgets/widget-router";`
+      vueRouterContent = `${importStr}\n${vueRouterContent}`
+      vueRouterContent.replace('routes: [', `routes: [\n...WidgetRouter,`)
+      fs.writeFileSync(vueRouterPath, await PrettierUtils.format(vueRouterContent, 'typescript'))
+    }
+  }
 }
 
 async function addDependency(packageName: string, dependencies: any) {

package/src/utils/EJSUtils.ts

@@ -6,12 +6,12 @@ import {dirname} from 'dirname-filename-esm'
 import {PrettierUtils} from './PrettierUtils'
 
 export class EJSUtils {
-  static renderToFile(templateFile: string, outputFile: string, parser: BuiltInParserName, renderOptions: Data) {
+  static async renderToFile(templateFile: string, outputFile: string, parser: BuiltInParserName, renderOptions: Data) {
     const defineTemplatePath = path.join(dirname(import.meta), '../template', templateFile)
     let defineTemplate = fs.readFileSync(defineTemplatePath, 'utf8')
     // Format the EJS code using Prettier
     let code = ejs.render(defineTemplate, renderOptions)
-    const formattedEJSCode = PrettierUtils.format(code,parser)
+    const formattedEJSCode =await PrettierUtils.format(code,parser)
     fs.writeFileSync(outputFile, formattedEJSCode)
   }
 }

package/src/utils/PrettierUtils.ts

@@ -1,8 +1,8 @@
-import prettier from 'prettier'
+import {BuiltInParserName, format} from 'prettier'
 
 export class PrettierUtils {
-  static format(code:string,parser: prettier.BuiltInParserName) {
-   return  prettier.format(code, {
+  static async format(code: string, parser: BuiltInParserName) {
+    return format(code, {
       parser: parser,
       tabWidth: 2,
       singleQuote: true,

package/src/utils/WidgetPackageUtils.ts

@@ -0,0 +1,13 @@
+import path from 'path'
+import {WidgetPackage} from '@widget-js/core'
+import fs from "fs";
+
+export class WidgetPackageUtils {
+  static getRootDir(widgetPackage: WidgetPackage) {
+    const widgetRootDir = path.join(process.cwd(), widgetPackage.devOptions?.folder ?? './src/widgets')
+    if (!fs.existsSync(widgetRootDir)) {
+      fs.mkdirSync(widgetRootDir, {recursive: true})
+    }
+    return widgetRootDir;
+  }
+}

package/template/WidgetPackage.ejs

@@ -7,7 +7,6 @@ export default new WidgetPackage({
     'zh-CN': '修改成你的组件描述',
   },
   entry: 'index.html',
-  hash: true,
   homepage: '',
   name: '<%= name  %>',
   title: {

package/lib/chunk-YHUBPHJK.js

@@ -1,31 +0,0 @@
-// src/utils/PrettierUtils.ts
-import prettier from "prettier";
-var PrettierUtils = class {
-  static format(code, parser) {
-    return prettier.format(code, {
-      parser,
-      tabWidth: 2,
-      singleQuote: true
-    });
-  }
-};
-
-// src/utils/EJSUtils.ts
-import path from "path";
-import fs from "fs";
-import ejs from "ejs";
-import { dirname } from "dirname-filename-esm";
-var EJSUtils = class {
-  static renderToFile(templateFile, outputFile, parser, renderOptions) {
-    const defineTemplatePath = path.join(dirname(import.meta), "../template", templateFile);
-    let defineTemplate = fs.readFileSync(defineTemplatePath, "utf8");
-    let code = ejs.render(defineTemplate, renderOptions);
-    const formattedEJSCode = PrettierUtils.format(code, parser);
-    fs.writeFileSync(outputFile, formattedEJSCode);
-  }
-};
-
-export {
-  PrettierUtils,
-  EJSUtils
-};

package/widget.package.ts

@@ -1,20 +0,0 @@
-import { WidgetPackage } from '@widget-js/core';
-
-//TODO 完善组件包信息
-export default new WidgetPackage({
-  author: '修改成你的信息',
-  description: {
-    'zh-CN': '修改成你的组件描述',
-  },
-  entry: 'index.html',
-  hash: true,
-  homepage: '',
-  name: 'cn.te',
-  title: {
-    'zh-CN': '修改成你的组件标题',
-  },
-  version: '1.0.0',
-  devOptions: {
-    folder: './src/widgets/',
-  },
-});

package/widget.ts

@@ -1,22 +0,0 @@
-import { WidgetPackage } from '@widget-js/core';
-
-//TODO 完善组件包信息
-export default new WidgetPackage({
-  author: '修改成你的信息',
-  description: {
-    'zh-CN': '修改成你的组件描述',
-  },
-  entry: 'index.html',
-  hash: true,
-  homepage: '',
-  name: 'test',
-  remoteEntry: '',
-  remotePackage: '',
-  title: {
-    'zh-CN': '修改成你的组件标题',
-  },
-  version: '1.0.0',
-  devOptions: {
-    folder: './src/widgets/',
-  },
-});