@varlet/cli 2.0.0-alpha.1663742071515 → 2.0.0-alpha.1664031123039

package/README.en-US.md

@@ -281,7 +281,7 @@ To configure `babel`, first specify the target browser in `package.json`
 ```json
 {
   "browserslist": [
-    "Chrome >= 51",
+    "Chrome >= 54",
     "iOS >= 10"
   ]
 }

package/README.md

@@ -277,7 +277,7 @@ varlet-cli gen <projectName>
 ```json
 {
   "browserslist": [
-    "Chrome >= 51",
+    "Chrome >= 54",
     "iOS >= 10"
   ]
 }

package/lib/commands/create.js

@@ -35,102 +35,80 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.create = void 0;
+var ejs_1 = __importDefault(require("ejs"));
+var logger_1 = __importDefault(require("../shared/logger"));
 var shared_1 = require("@varlet/shared");
 var inquirer_1 = require("inquirer");
-var ejs_1 = __importDefault(require("ejs"));
 var fs_extra_1 = require("fs-extra");
 var lodash_1 = require("lodash");
 var path_1 = require("path");
-var logger_1 = __importDefault(require("../shared/logger"));
 var fsUtils_1 = require("../shared/fsUtils");
 var varlet_config_1 = require("../config/varlet.config");
 var constant_1 = require("../shared/constant");
-var templateFiles = ['__tests__/index.spec.js', 'example/index.vue', "less.less", 'index.ts'];
-var namespace = (0, lodash_1.get)((0, varlet_config_1.getVarletConfig)(), 'namespace');
-var createOptions = {
-    kebabCaseName: 'component-name',
-    bigCamelizeName: 'componentName',
-    style: 'vue',
-    namespace: namespace,
-    bigCamelizeNamespace: (0, shared_1.bigCamelize)(namespace),
-};
-var ejsRender = function (filePath, options) {
-    var _a = (0, path_1.parse)(filePath), dir = _a.dir, name = _a.name, ext = _a.ext;
-    var componentPath = (0, path_1.resolve)(constant_1.SRC_DIR, options.kebabCaseName);
-    var templatePath = (0, path_1.resolve)(componentPath, dir, "".concat(name, ".ejs"));
-    var templateCode = (0, fs_extra_1.readFileSync)(templatePath, { encoding: 'utf-8' });
-    var code = ejs_1.default.render(templateCode, options);
-    if (ext.endsWith(name)) {
-        filePath = "".concat(name === 'less' ? createOptions.kebabCaseName : createOptions.bigCamelizeName).concat(ext);
-    }
-    (0, fs_extra_1.outputFileSync)((0, path_1.resolve)(componentPath, filePath), code);
-};
-var removeFiles = function (path) { return __awaiter(void 0, void 0, void 0, function () {
-    return __generator(this, function (_a) {
-        switch (_a.label) {
-            case 0:
-                !createOptions.locale && (0, fs_extra_1.removeSync)("".concat(path, "/example/locale"));
-                return [4 /*yield*/, (0, fsUtils_1.glob)("".concat(path, "/**/*.ejs"))];
-            case 1:
-                (_a.sent()).forEach(function (file) { return (0, fs_extra_1.removeSync)(file); });
-                return [2 /*return*/];
-        }
+function renderTemplates(componentFolder, componentFolderName, renderData) {
+    return __awaiter(this, void 0, void 0, function () {
+        var templates;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0: return [4 /*yield*/, (0, fsUtils_1.glob)("".concat(componentFolder, "/**/*.ejs"))];
+                case 1:
+                    templates = _a.sent();
+                    templates.forEach(function (template) {
+                        var templateCode = (0, fs_extra_1.readFileSync)(template, { encoding: 'utf-8' });
+                        var code = ejs_1.default.render(templateCode, renderData);
+                        var file = template
+                            .replace('[componentName]', (0, shared_1.camelize)(componentFolderName))
+                            .replace('[ComponentName]', (0, shared_1.bigCamelize)(componentFolderName))
+                            .replace('.ejs', '');
+                        (0, fs_extra_1.writeFileSync)(file, code);
+                        (0, fs_extra_1.removeSync)(template);
+                    });
+                    return [2 /*return*/];
+            }
+        });
     });
-}); };
+}
 function create(options) {
     return __awaiter(this, void 0, void 0, function () {
-        var name, _a, locale, _b, style, componentPath;
+        var namespace, renderData, name, _a, componentFolder, componentFolderName, locale, _b, style;
         return __generator(this, function (_c) {
             switch (_c.label) {
                 case 0:
-                    logger_1.default.title('\n📦📦 Create a Component ! \n');
+                    logger_1.default.title('\n📦📦 Create a component ! \n');
+                    namespace = (0, lodash_1.get)((0, varlet_config_1.getVarletConfig)(), 'namespace');
+                    renderData = {
+                        namespace: namespace,
+                        bigCamelizeNamespace: (0, shared_1.bigCamelize)(namespace),
+                        kebabCaseName: 'component-name',
+                        bigCamelizeName: 'ComponentName',
+                        camelizeName: 'componentName',
+                        style: 'vue',
+                    };
                     if (!options.name) return [3 /*break*/, 1];
                     _a = options;
                     return [3 /*break*/, 3];
                 case 1: return [4 /*yield*/, (0, inquirer_1.prompt)({
                         name: 'name',
                         message: 'Name of the component created: ',
-                        default: createOptions.kebabCaseName,
+                        default: renderData.kebabCaseName,
                     })];
                 case 2:
                     _a = _c.sent();
                     _c.label = 3;
                 case 3:
                     name = (_a).name;
-                    createOptions.kebabCaseName = (0, shared_1.kebabCase)(name);
-                    createOptions.bigCamelizeName = (0, shared_1.bigCamelize)(name);
-                    if ((0, fs_extra_1.pathExistsSync)((0, path_1.resolve)(constant_1.SRC_DIR, createOptions.kebabCaseName))) {
-                        logger_1.default.error("".concat(createOptions.kebabCaseName, " already exist and cannot be recreated..."));
+                    renderData.kebabCaseName = (0, shared_1.kebabCase)(name);
+                    renderData.camelizeName = (0, shared_1.camelize)(name);
+                    renderData.bigCamelizeName = (0, shared_1.bigCamelize)(name);
+                    componentFolder = (0, path_1.resolve)(constant_1.SRC_DIR, renderData.kebabCaseName);
+                    componentFolderName = renderData.kebabCaseName;
+                    if ((0, fs_extra_1.pathExistsSync)(componentFolder)) {
+                        logger_1.default.warning("".concat(componentFolderName, " already exist and cannot be recreated..."));
                         return [2 /*return*/];
                     }
                     if (!options.locale) return [3 /*break*/, 4];
@@ -147,9 +125,9 @@ function create(options) {
                     _c.label = 6;
                 case 6:
                     locale = (_b).locale;
-                    createOptions.locale = locale;
+                    renderData.locale = locale;
                     if (!(options.sfc || options.tsx)) return [3 /*break*/, 7];
-                    createOptions.style = options.sfc ? 'vue' : 'tsx';
+                    renderData.style = options.sfc ? 'vue' : 'tsx';
                     return [3 /*break*/, 9];
                 case 7: return [4 /*yield*/, (0, inquirer_1.prompt)({
                         name: 'style',
@@ -163,16 +141,23 @@ function create(options) {
                     })];
                 case 8:
                     style = (_c.sent()).style;
-                    createOptions.style = style;
+                    renderData.style = style;
                     _c.label = 9;
                 case 9:
-                    componentPath = (0, path_1.resolve)(constant_1.SRC_DIR, createOptions.kebabCaseName);
-                    (0, fs_extra_1.copySync)((0, path_1.resolve)(__dirname, '../../template/create'), componentPath);
-                    __spreadArray(__spreadArray([], __read(templateFiles), false), ["".concat(createOptions.style, ".").concat(createOptions.style)], false).forEach(function (file) { return ejsRender(file, createOptions); });
-                    return [4 /*yield*/, removeFiles(componentPath)];
+                    (0, fs_extra_1.copySync)((0, path_1.resolve)(__dirname, '../../template/create'), componentFolder);
+                    return [4 /*yield*/, renderTemplates(componentFolder, componentFolderName, renderData)];
                 case 10:
                     _c.sent();
-                    logger_1.default.success("Create ".concat(createOptions.kebabCaseName, " component success!"));
+                    if (!renderData.locale) {
+                        (0, fs_extra_1.removeSync)((0, path_1.resolve)(componentFolder, '/example/locale'));
+                    }
+                    if (renderData.style !== 'vue') {
+                        (0, fs_extra_1.removeSync)((0, path_1.resolve)(componentFolder, "".concat(renderData.bigCamelizeName, ".vue")));
+                    }
+                    if (renderData.style !== 'tsx') {
+                        (0, fs_extra_1.removeSync)((0, path_1.resolve)(componentFolder, "".concat(renderData.bigCamelizeName, ".tsx")));
+                    }
+                    logger_1.default.success("Create ".concat(componentFolderName, " component success!"));
                     return [2 /*return*/];
             }
         });

package/lib/commands/gen.js

@@ -45,11 +45,6 @@ var inquirer_1 = require("inquirer");
 var path_1 = require("path");
 var fs_extra_1 = require("fs-extra");
 var constant_1 = require("../shared/constant");
-var genOptions = {
-    name: 'varlet-app',
-    locale: false,
-    style: 'sfc',
-};
 function syncVersion(name) {
     var file = (0, path_1.resolve)(constant_1.CWD, name, 'package.json');
     var pkg = JSON.parse((0, fs_extra_1.readFileSync)(file, 'utf-8'));
@@ -64,7 +59,7 @@ function syncVersion(name) {
 }
 function gen(options) {
     return __awaiter(this, void 0, void 0, function () {
-        var name, _a, dest, style, i18n, _b, dirName, base, configBase, code;
+        var name, _a, dest, codeStyle, style, i18n, _b, dirName, base, configBase, code;
         return __generator(this, function (_c) {
             switch (_c.label) {
                 case 0:
@@ -75,7 +70,7 @@ function gen(options) {
                 case 1: return [4 /*yield*/, (0, inquirer_1.prompt)({
                         name: 'name',
                         message: 'Name of the generate application: ',
-                        default: genOptions.name,
+                        default: 'varlet-cli-app',
                     })];
                 case 2:
                     _a = _c.sent();
@@ -88,7 +83,7 @@ function gen(options) {
                         return [2 /*return*/];
                     }
                     if (!(options.sfc || options.tsx)) return [3 /*break*/, 4];
-                    genOptions.style = options.sfc ? 'sfc' : 'tsx';
+                    codeStyle = options.sfc ? 'sfc' : 'tsx';
                     return [3 /*break*/, 6];
                 case 4: return [4 /*yield*/, (0, inquirer_1.prompt)({
                         name: 'style',
@@ -98,7 +93,7 @@ function gen(options) {
                     })];
                 case 5:
                     style = (_c.sent()).style;
-                    genOptions.style = style;
+                    codeStyle = style;
                     _c.label = 6;
                 case 6:
                     if (!options.i18n) return [3 /*break*/, 7];
@@ -118,7 +113,7 @@ function gen(options) {
                     dirName = i18n ? 'i18n' : 'default';
                     base = (0, path_1.resolve)(constant_1.GENERATORS_DIR, 'base');
                     configBase = (0, path_1.resolve)(constant_1.GENERATORS_DIR, 'config', dirName, 'base');
-                    code = (0, path_1.resolve)(constant_1.GENERATORS_DIR, 'config', dirName, genOptions.style);
+                    code = (0, path_1.resolve)(constant_1.GENERATORS_DIR, 'config', dirName, codeStyle);
                     return [4 /*yield*/, (0, fs_extra_1.copy)(base, dest)];
                 case 10:
                     _c.sent();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/cli",
-  "version": "2.0.0-alpha.1663742071515",
+  "version": "2.0.0-alpha.1664031123039",
   "description": "cli of varlet",
   "bin": {
     "varlet-cli": "./lib/index.js"
@@ -32,10 +32,10 @@
     "@babel/helper-plugin-utils": "^7.14.5",
     "@babel/preset-env": "^7.14.8",
     "@babel/preset-typescript": "^7.14.5",
-    "@varlet/icons": "2.0.0-alpha.1663742071515",
-    "@varlet/markdown-vite-plugin": "2.0.0-alpha.1663742071515",
-    "@varlet/shared": "2.0.0-alpha.1663742071515",
-    "@varlet/touch-emulator": "2.0.0-alpha.1663742071515",
+    "@varlet/icons": "2.0.0-alpha.1664031123039",
+    "@varlet/markdown-vite-plugin": "2.0.0-alpha.1664031123039",
+    "@varlet/shared": "2.0.0-alpha.1664031123039",
+    "@varlet/touch-emulator": "2.0.0-alpha.1664031123039",
     "@vitejs/plugin-vue": "3.0.1",
     "@vitejs/plugin-vue-jsx": "2.0.0",
     "@vue/babel-plugin-jsx": "1.1.1",
@@ -79,10 +79,9 @@
     "@types/semver": "^7.3.9"
   },
   "peerDependencies": {
-    "@varlet/touch-emulator": "2.0.0-alpha.1663742071515",
+    "@varlet/touch-emulator": "2.0.0-alpha.1664031123039",
     "@vue/runtime-core": "3.2.16",
     "@vue/test-utils": "^2.0.2",
-    "jsdom": "^20.0.0",
     "clipboard": "^2.0.6",
     "live-server": "^1.2.1",
     "lodash-es": "^4.17.21",

package/template/create/{tsx.ejs → [ComponentName].tsx.ejs}

@@ -1,13 +1,13 @@
 import { defineComponent } from 'vue'
 import { props } from './props'
-import './<%- kebabCaseName %>.less'
+import './<%- camelizeName %>.less'
 
 export default defineComponent({
   name: '<%- bigCamelizeNamespace + bigCamelizeName %>',
   props,
   setup(props, { slots }) {
     return () => {
-      return <div>{ slots.default?.() }</div>
+      return <div class="<%- namespace %>-<%- kebabCaseName %>">{ slots.default?.() }</div>
     }
   },
 })

package/template/create/{vue.ejs → [ComponentName].vue.ejs}

@@ -1,5 +1,5 @@
 <template>
-  <div class="var-<%- kebabCaseName %>"></div>
+  <div class="<%- namespace %>-<%- kebabCaseName %>"></div>
 </template>
 
 <script lang="ts">
@@ -13,5 +13,5 @@ export default defineComponent({
 </script>
 
 <style lang="less">
-@import './<%- kebabCaseName %>.less';
+@import './<%- camelizeName %>.less';
 </style>

package/template/create/__tests__/{index.spec.ejs → index.spec.js.ejs}

@@ -2,7 +2,12 @@ import <%- bigCamelizeName %> from '..'
 import { createApp } from 'vue'
 import { mount } from '@vue/test-utils'
 
-test('test <%- kebabCaseName %> use', () => {
+test('test <%- kebabCaseName %> plugin', () => {
   const app = createApp({}).use(<%- bigCamelizeName %>)
   expect(app.component(<%- bigCamelizeName %>.name)).toBeTruthy()
 })
+
+test('test <%- kebabCaseName %> snapshot', () => {
+  const wrapper = mount(<%- bigCamelizeName %>)
+  expect(wrapper.html()).toMatchSnapshot()
+})

package/template/create/{index.ejs → index.ts.ejs}

@@ -1,5 +1,4 @@
 // Component entry, the folder where the file exists will be exposed to the user
-
 import <%- bigCamelizeName %> from './<%- bigCamelizeName %>.vue'
 import type { App } from 'vue'
 

package/template/generators/base/.prettierignore

@@ -1,9 +1,14 @@
 coverage/**
+highlight/**
 es/**
 umd/**
+lib/**
 site/**
 public/**
-types/global.d.ts
+.varlet/**
+types/index.d.ts
 *.md
 package.json
 
+pnpm-lock.yaml
+pnpm-workspace.yaml

package/template/generators/base/README.md

@@ -77,6 +77,6 @@ pnpm release
 #### Create component template files
 
 ```shell
-pnpm create <componentName>
+pnpm run create
 ```
 

package/template/generators/base/public/logo.svg

@@ -1 +1,30 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 261.76 226.69"><path d="M161.096.001l-30.225 52.351L100.647.001H-.005l130.877 226.688L261.749.001z" fill="#41b883"/><path d="M161.096.001l-30.225 52.351L100.647.001H52.346l78.526 136.01L209.398.001z" fill="#34495e"/></svg>
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="138px" height="146px" viewBox="0 0 138 146" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>编组 2备份 4</title>
+    <defs>
+        <linearGradient x1="42.6722626%" y1="13.5075845%" x2="58.7114688%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#3999FF" offset="0%"></stop>
+            <stop stop-color="#8F28FB" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="15.5408894%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#722DFA" offset="0%"></stop>
+            <stop stop-color="#21D4FD" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
+            <stop stop-color="#0DBBFA" offset="0%"></stop>
+            <stop stop-color="#2EF4D0" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="40.4455375%" y1="0%" x2="61.1107186%" y2="100%" id="linearGradient-4">
+            <stop stop-color="#54E7FA" offset="0%"></stop>
+            <stop stop-color="#3478FF" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="编组-2备份-4">
+            <path d="M61.1454478,0 L80.8081453,0 C83.2200978,-4.36166956e-15 85.3680539,1.52588995 86.1620863,3.80339469 L133.110133,138.463395 C134.14103,141.420295 132.579697,144.653043 129.622797,145.683941 C129.022705,145.893158 128.391709,146 127.756192,146 L104.065574,146 L104.065574,146 L55.7915068,7.53660531 C54.7606091,4.57970533 56.3219425,1.34695661 59.2788425,0.316058965 C59.8789348,0.106841966 60.5099303,8.99852687e-15 61.1454478,0 Z" id="矩形备份-19" fill="url(#linearGradient-1)" transform="translate(94.450820, 73.000000) scale(-1, 1) translate(-94.450820, -73.000000) "></path>
+            <path d="M10.7758114,0.143137255 L28.2717621,0.143137255 C31.4003503,0.143137255 33.937707,2.67721101 33.9417574,5.8057966 L34.0758197,109.356863 L34.0758197,109.356863 L2.40368852,141.419608 L2.27081564,8.65664929 C2.26611457,3.95946985 6.0701199,0.147842583 10.7672993,0.143141514 C10.7701367,0.143138675 10.772974,0.143137255 10.7758114,0.143137255 Z" id="矩形备份-20" fill="url(#linearGradient-2)" transform="translate(18.169057, 70.781373) scale(-1, 1) translate(-18.169057, -70.781373) "></path>
+            <path d="M59.4954713,57.5193828 L80.5061701,57.5193828 C83.6322889,57.5193828 86.1686187,60.0496067 86.1761536,63.1757164 L86.440508,172.851892 C86.4456008,174.964841 85.2753699,176.905341 83.4041828,177.886788 L54.099775,193.257088 L54.099775,193.257088 L53.8254839,63.201341 C53.8188796,60.0698934 56.3520656,57.5259998 59.4835131,57.5193954 C59.4874992,57.519387 59.4914852,57.5193828 59.4954713,57.5193828 Z" id="矩形备份-21" fill="url(#linearGradient-3)" transform="translate(70.131148, 125.388235) rotate(-270.000000) translate(-70.131148, -125.388235) "></path>
+            <path d="M8.0988647,0 L27.7025748,0 C30.0859285,1.09876935e-16 32.2148633,1.49046324 33.0303471,3.72996343 L83.9352009,143.526025 L83.9352009,143.526025 L84.8360656,146 L57.1334908,146 C54.7501371,146 52.6212023,144.509537 51.8057185,142.270037 L2.77109236,7.61003657 C1.69963975,4.66758916 3.21638072,1.41368027 6.15882813,0.34222766 C6.78058382,0.115823698 7.43717075,1.89790805e-15 8.0988647,0 Z" id="矩形备份-22" fill="url(#linearGradient-4)"></path>
+        </g>
+    </g>
+</svg>

package/template/generators/config/default/base/docs/home.zh-CN.md

@@ -1,11 +1,3 @@
-<div class="varlet-introduce">
-  <div class="varlet-introduce__row">
-    <img class="varlet-introduce__image" src="../public/logo.svg" />
-    <div class="varlet-introduce__name">Basic UI</div>  
-  </div>
-  <div class="varlet-introduce__des">一个组件库</div>
-</div>
-
 ### 介绍
 
 这里可以介绍一下组件库, 想写什么就写什么...

package/template/generators/config/default/base/package.json

@@ -1,7 +1,7 @@
 {
-  "name": "basic-ui",
+  "name": "@varlet/ui",
   "version": "0.0.0",
-  "description": "A basic components library",
+  "description": "A components library example",
   "main": "lib/index.js",
   "module": "es/index.js",
   "typings": "types/index.d.ts",
@@ -18,6 +18,10 @@
   "sideEffects": [
     "es/**/style/*",
     "lib/**/style/*",
+    "es/style.js",
+    "es/less.js",
+    "lib/style.js",
+    "lib/less.js",
     "*.css",
     "*.less"
   ],
@@ -33,7 +37,7 @@
     "test": "varlet-cli jest",
     "test:watch": "varlet-cli jest -w",
     "test:watchAll": "varlet-cli jest -wa",
-    "create": "varlet-cli create -d"
+    "create": "varlet-cli create"
   },
   "peerDependencies": {
     "vue": "^3.2.0"
@@ -45,7 +49,7 @@
     "@varlet/stylelint-config": "workspace:*",
     "@varlet/touch-emulator": "workspace:*",
     "@varlet/shared": "workspace:*",
-    "@vue/test-utils": "2.0.0-rc.6",
+    "@vue/test-utils": "^2.0.2",
     "clipboard": "^2.0.6",
     "eslint": "^7.30.0",
     "lint-staged": "^10.5.0",
@@ -76,6 +80,9 @@
       "site/**",
       "public/**",
       "src/*/__tests__/**",
+      "coverage/**",
+      "highlight/**",
+      "types/index.d.ts",
       ".varlet/**"
     ],
     "extends": [
@@ -98,7 +105,7 @@
     ]
   },
   "browserslist": [
-    "Chrome >= 51",
+    "Chrome >= 54",
     "iOS >= 10"
   ],
   "packageManager": "pnpm@7.9.0"

package/template/generators/config/default/base/varlet.config.js

@@ -1,71 +1,11 @@
 module.exports = {
-  name: 'Basic',
-  namespace: 'b',
-  title: 'Basic UI',
   logo: './logo.svg',
   useMobile: true,
-  themes: {
-    'color-body': '#fff',
-    'color-bar': '#fff',
-    'color-sub-bar': '#f5f5f5',
-    'color-text': '#555',
-    'color-sub-text': '#888',
-    'color-border': 'rgba(0, 0, 0, 0.12)',
-    'color-shadow': '#eee',
-    'color-introduce-border': '#009688',
-    'color-primary': '#009688',
-    'color-link': '#009688',
-    'color-type': '#009688',
-    'color-progress': '#009688',
-    'color-progress-track': '#fff',
-    'color-side-bar': '#009688',
-    'color-side-bar-active-background': '#00968821',
-    'color-app-bar': '#009688',
-    'color-nav-button-hover-background': 'rgba(0, 0, 0, 0.08)',
-    'color-pc-language-active': '#009688',
-    'color-pc-language-active-background': '#00968821',
-    'color-mobile-language-active': '#009688',
-    'color-mobile-language-active-background': '#00968821',
-    'color-mobile-cell-hover': '#009688',
-  },
-  darkThemes: {
-    'color-body': '#121212',
-    'color-bar': '#1e1e1e',
-    'color-sub-bar': '#272727',
-    'color-text': '#fff',
-    'color-sub-text': '#aaa',
-    'color-border': '#333',
-    'color-shadow': '#121212',
-    'color-introduce-border': '#555',
-    'color-primary': '#009688',
-    'color-link': '#009688',
-    'color-type': '#009688',
-    'color-progress': '#009688',
-    'color-progress-track': '#202020',
-    'color-side-bar': '#009688',
-    'color-side-bar-active-background': '#00968821',
-    'color-app-bar': '#009688',
-    'color-nav-button-hover-background': 'rgba(255, 255, 255, 0.08)',
-    'color-pc-language-active': '#009688',
-    'color-pc-language-active-background': '#00968821',
-    'color-mobile-language-active': '#009688',
-    'color-mobile-language-active-background': '#00968821',
-    'color-mobile-cell-hover': '#009688',
-  },
-  highlight: {
-    style: './highlight.css',
-  },
   pc: {
-    redirect: '/home',
-    title: {
-      'zh-CN': '一个组件库',
-    },
     header: {
       darkMode: null,
-      versions: null,
       i18n: null,
       playground: null,
-      github: 'https://github.com/varletjs/varlet',
     },
     menu: [
       {
@@ -97,14 +37,9 @@ module.exports = {
     ],
   },
   mobile: {
-    redirect: '/home',
-    title: {
-      'zh-CN': '一个组件库',
-    },
     header: {
       i18n: null,
       darkMode: null,
-      github: 'https://github.com/varletjs/varlet',
     },
   },
 }

package/template/generators/config/default/sfc/src/button/Button.vue

@@ -1,13 +1,14 @@
 <template>
-  <button class="basic-button" :style="{ background: color }">
+  <button class="var-button" :style="{ background: color }">
     <slot />
   </button>
 </template>
 
 <script lang="ts">
 import { defineComponent, PropType } from 'vue'
+
 export default defineComponent({
-  name: 'BButton',
+  name: 'VarButton',
   props: {
     color: {
       type: String,

package/template/generators/config/default/sfc/src/button/button.less

@@ -1,7 +1,7 @@
-.basic-button {
+.var-button {
   display: flex;
   padding: 10px;
-  background: #009688;
+  background: #3a7afe;
   color: #fff;
   outline: none;
   border: none;

package/template/generators/config/default/sfc/src/button/docs/zh-CN.md

@@ -1,17 +1,8 @@
 # 按钮
 
-### 引入
-
-```js
-import { createApp } from 'vue'
-import { Button } from 'basic-ui'
-
-createApp().use(Button)
-```
-
 ### 基本使用
 ```html
-<b-button>组件库从我开始</b-button>
+<var-button>组件库从我开始</var-button>
 ```
 
 ```vue
@@ -20,7 +11,7 @@ import BasicUse from '../example/BasicUse'
 
 ### 主题色按钮
 ```html
-<b-button color="#009688">组件库从我开始</b-button>
+<var-button color="#009688">组件库从我开始</var-button>
 ```
 
 ```vue

package/template/generators/config/default/sfc/src/button/example/BasicUse.vue

@@ -1,7 +1,7 @@
 <script setup>
-import BButton from '../Button'
+import VarButton from '..'
 </script>
 
 <template>
-  <b-button>起步</b-button>
+  <var-button>起步</var-button>
 </template>