upd: tsc

jd/generate-types-taro.cjs

@@ -1,33 +1,85 @@
 const config = require('../src/config.json');
-const package = require('../package.json');
 const path = require('path');
-const fs = require('fs-extra');
-let importStr = `import Locale from '../packages/locale';\n`;
-const packages = [];
-config.nav.map((item) => {
-  item.packages.forEach((element) => {
-    let { name } = element;
-    const filePath = path.join(`./src/packages/__VUE/${name.toLowerCase()}/index.taro.vue`);
-    importStr += `import ${name} from './__VUE/${name.toLowerCase()}/${
-      fs.existsSync(filePath) ? 'index.taro.vue' : 'index.vue'
-    }';\n`;
-
-    packages.push(name);
+const fs = require('fs');
+
+const sourceDir = path.resolve(__dirname, './../tsc/type/src/packages') // 拷贝的源文件夹
+
+const toDir = path.resolve(__dirname, './../dist/types'); // ./../dist
+
+const basePath = path.join(toDir, '__VUE');
+
+const fileList = [];
+
+let packages = [];
+
+const preContent = `
+declare type Install<T> = T & {
+  install(app: import('vue').App): void;
+};\n`;
+const start = 'declare const _default:';
+const end = ';\nexport default _default;\n';
+const regex = new RegExp(`${start}([\\s\\S]*?)${end}`);
+
+const getCompList = (basePath) => {
+  const files = fs.readdirSync(basePath);
+  files.forEach((filename) => {
+    const filedir = path.join(basePath, filename);
+    //根据文件路径获取文件信息，返回一个fs.Stats对象
+    const stats = fs.statSync(filedir);
+    const isFile = stats.isFile();//是文件  
+    const isDir = stats.isDirectory();//是文件夹  
+    if(isFile){
+      fileList.push(filedir);
+    }
+    if(isDir){
+      getCompList(filedir);//递归，如果是文件夹，就继续遍历该文件夹下面的文件  
+    }
   });
-});
-let installFunction = `
-export { Locale,${packages.join(',')} };`;
-let fileStr = importStr + installFunction;
-fs.outputFileSync(path.resolve(__dirname, '../dist/types/nutui.d.ts'), fileStr, 'utf8');
-fs.outputFileSync(
-  path.resolve(__dirname, '../dist/types/index.d.ts'),
-  `declare namespace _default {
-  export { install };
-  export { version };
 }
-export function install(app: any): void;
-export const version: '${package.version}';
-export default _default;
-export * from './nutui';`,
-  'utf8'
-);
+
+const getCompName = (name) => {
+  if(!packages.length) {
+    config.nav.forEach((item, index) => {
+      packages = packages.concat(item.packages);
+    });
+  }
+  const packageName = packages.find((item) => item.name.toLowerCase() === name.toLowerCase());
+  return packageName ? packageName.name : ''
+}
+
+fs.cp(sourceDir, toDir, { recursive: true }, (err) => {
+  if(err) {
+    console.error(err);
+    return;
+  }
+
+  const oldName = path.join(toDir, 'nutui.taro.vue.build.d.ts');
+  const newName = path.join(toDir, 'nutui.d.ts');
+
+  fs.rename(oldName, newName, (err) => {
+    if(err) {
+      console.error(err);
+    }
+  })
+
+  getCompList(basePath);
+
+  fileList.forEach((item, index) => {
+    const content = fs.readFileSync(item).toLocaleString();
+    const inputs = content.match(regex);
+    
+    if(inputs && inputs.length) {
+      let name = item.substring(0, item.lastIndexOf('/'))
+      name = name.substring(name.lastIndexOf('/') + 1)
+      let remain = `
+declare module 'vue' {
+  interface GlobalComponents {
+      Nut${getCompName(name)}: typeof _default;
+  }
+}`;
+      let changeContent = content.replace(regex, `${preContent}${start} Install<${inputs[1]}>${end}${remain}`)
+      fs.writeFileSync(item, changeContent);
+    }
+  });
+
+});

jd/generate-types.cjs

@@ -1,5 +1,4 @@
 const config = require('../src/config.json');
-const pck = require('./../package.json');
 const path = require('path');
 const fs = require('fs');
 
@@ -11,6 +10,16 @@ const basePath = path.join(toDir, '__VUE');
 
 const fileList = [];
 
+let packages = [];
+
+const preContent = `
+declare type Install<T> = T & {
+  install(app: import('vue').App): void;
+};\n`;
+const start = 'declare const _default:';
+const end = ';\nexport default _default;\n';
+const regex = new RegExp(`${start}([\\s\\S]*?)${end}`);
+
 const getCompList = (basePath) => {
   const files = fs.readdirSync(basePath);
   files.forEach((filename) => {
@@ -19,15 +28,25 @@ const getCompList = (basePath) => {
     const stats = fs.statSync(filedir);
     const isFile = stats.isFile();//是文件  
     const isDir = stats.isDirectory();//是文件夹  
-    if(isFile){  
+    if(isFile){
       fileList.push(filedir);
-    }  
+    }
     if(isDir){
       getCompList(filedir);//递归，如果是文件夹，就继续遍历该文件夹下面的文件  
     }
   });
 }
 
+const getCompName = (name) => {
+  if(!packages.length) {
+    config.nav.forEach((item, index) => {
+      packages = packages.concat(item.packages);
+    });
+  }
+  const packageName = packages.find((item) => item.name.toLowerCase() === name.toLowerCase());
+  return packageName ? packageName.name : ''
+}
+
 fs.cp(sourceDir, toDir, { recursive: true }, (err) => {
   if(err) {
     console.error(err);
@@ -45,8 +64,21 @@ fs.cp(sourceDir, toDir, { recursive: true }, (err) => {
 
   getCompList(basePath);
 
-  // fileList.forEach((item) => {
-  //   // 获取文件中的内容
-
-  // });
+  fileList.forEach((item, index) => {
+    const content = fs.readFileSync(item).toLocaleString();
+    const inputs = content.match(regex);
+    
+    if(inputs && inputs.length) {
+      let name = item.substring(0, item.lastIndexOf('/'))
+      name = name.substring(name.lastIndexOf('/') + 1)
+      let remain = `
+declare module 'vue' {
+  interface GlobalComponents {
+      Nut${getCompName(name)}: typeof _default;
+  }
+}`;
+      let changeContent = content.replace(regex, `${preContent}${start} Install<${inputs[1]}>${end}${remain}`)
+      fs.writeFileSync(item, changeContent);
+    }
+  });
 });

package.json

@@ -49,7 +49,7 @@
     "build:site": "npm run checked && vite build",
     "build:site-jdt": "npm run checked && vite build --config vite.config.jdt.ts ",
     "build:site:oss": "npm run checked && vite build --base=/nutui/4x/",
-    "build": "npm run checked && vite build --config vite.config.build.ts && vite build --config vite.config.build.disperse.ts && npm run generate:types && npm run generate:themes && vite build --config vite.config.build.css.ts && vite build --config vite.config.build.locale.ts && npm run attrs",
+    "build": "npm run checked && vite build --config vite.config.build.ts && vite build --config vite.config.build.disperse.ts && npm run dts && npm run generate:themes && vite build --config vite.config.build.css.ts && vite build --config vite.config.build.locale.ts && npm run attrs",
     "build:taro:vue": "npm run checked:taro:vue && vite build --config vite.config.build.taro.vue.ts && vite build --config vite.config.build.taro.vue.disperse.ts && npm run generate:types:taro && npm run generate:themes && vite build --config vite.config.build.css.ts && vite build --config vite.config.build.locale.ts && npm run attrs",
     "serve": "vite preview",
     "upload": "yarn build:site:oss && node ./jd/upload.js",
@@ -68,7 +68,7 @@
     "copydocs": "node ./jd/copymd.js",
     "createTaroConfig": "node ./jd/generate-taro-route.cjs",
     "attrs": "node ./jd/createAttributes.cjs",
-    "dts": "vue-tsc --declaration --emitDeclarationOnly -p ./tsconfig.declaration.json && npm run generate:types"
+    "dts": "vue-tsc --declaration --emitDeclarationOnly -p ./tsconfig.declaration.json"
   },
   "standard-version": {
     "scripts": {

src/packages/__VUE/temp/demo.vue

@@ -1,25 +0,0 @@
-<template>
-  <div class="demo">
-    <h2>基础用法</h2>
-    <nut-cell>
-      <nut-temp name="wifi"></nut-temp>
-      <nut-temp name="mail" txt="test txt"></nut-temp>
-    </nut-cell>
-  </div>
-</template>
-
-<script lang="ts">
-import { createComponent } from '@/packages/utils/create';
-const { createDemo } = createComponent('temp');
-export default createDemo({
-  props: {},
-  setup() {
-    return {};
-  }
-});
-</script>
-
-<style lang="scss" scoped>
-.nut-temp {
-}
-</style>

src/packages/__VUE/temp/doc.md

@@ -1,63 +0,0 @@
-# Temp xx组件
-
-### 介绍
-
-基于 xxxxxxx
-
-### 安装
-
-``` javascript
-import { createApp } from 'vue';
-import { Temp } from '@nutui/nutui';
-
-const app = createApp();
-app.use(Temp);
-
-```
-
-
-### 基础用法1
-
-`Icon` 的 `name` 属性支持传入图标名称或图片链接。
-
-```html
-<nut-temp name="wifi"></nut-temp>
-<nut-temp name="mail"></nut-temp>
-```
-
-### 基础用法2
-
-`Icon` 的 `name` 属性支持传入图标名称或图片链接。
-
-```html
-<nut-temp name="wifi"></nut-temp>
-<nut-temp name="mail"></nut-temp>
-```
-
-### 基础用法3
-
-`Icon` 的 `name` 属性支持传入图标名称或图片链接。
-
-```html
-<nut-temp name="wifi"></nut-temp>
-<nut-temp name="mail"></nut-temp>
-```
-
-
-## API
-
-### Props
-
-| 参数         | 说明                             | 类型   | 默认值           |
-|--------------|----------------------------------|--------|------------------|
-| name         | 图标名称或图片链接               | String | -                |
-| color        | 图标颜色                         | String | -                |
-| size         | 图标大小，如 `20px` `2em` `2rem` | String | -                |
-| class-prefix | 类名前缀，用于使用自定义图标     | String | `nutui-iconfont` |
-| tag          | HTML 标签                        | String | `i`              |
-
-### Events
-
-| 事件名 | 说明           | 回调参数     |
-|--------|----------------|--------------|
-| click  | 点击图标时触发 | event: Event |

src/packages/__VUE/temp/index.scss

@@ -1,2 +0,0 @@
-.nut-temp {
-}

src/packages/__VUE/temp/index.vue

@@ -1,37 +0,0 @@
-<template>
-  <view :class="classes" @click="handleClick">
-    <view>{{ name }}</view>
-    <view>{{ txt }}</view>
-  </view>
-</template>
-<script lang="ts">
-import { toRefs } from 'vue';
-import { createComponent } from '@/packages/utils/create';
-const { componentName, create } = createComponent('temp');
-
-export default create({
-  props: {
-    name: {
-      type: String,
-      default: ''
-    },
-    txt: {
-      type: String,
-      default: ''
-    }
-  },
-  emits: ['click'],
-
-  setup(props, { emit }) {
-    // console.log('componentName', componentName);
-
-    const { name, txt } = toRefs(props);
-
-    const handleClick = (event: Event) => {
-      emit('click', event);
-    };
-
-    return { name, txt, handleClick };
-  }
-});
-</script>

src/packages/utils/create/component.ts

@@ -9,6 +9,7 @@ import {
 } from 'vue';
 import locale from '@/packages/locale';
 import { getPropByPath, isFunction } from '../util';
+
 export function createComponent(name: string) {
   const componentName = 'nut-' + name;
   return {

vite.config.build.disperse.ts

@@ -1,5 +1,4 @@
 import { defineConfig } from 'vite';
-import dts from 'vite-plugin-dts';
 import vue from '@vitejs/plugin-vue';
 import path from 'path';
 import config from './package.json';
@@ -24,40 +23,7 @@ export default defineConfig({
   resolve: {
     alias: [{ find: '@', replacement: path.resolve(__dirname, './src') }]
   },
-  plugins: [
-    vue(),
-    dts({
-      insertTypesEntry: true,
-      copyDtsFiles: false,
-      cleanVueFileName: false,
-      outputDir: path.resolve(__dirname, './dist/types'),
-      include: path.resolve(__dirname, './src/packages/__VUE'),
-      beforeWriteFile: (filePath: string, content: string) => {
-        const fileContent = `import { App, PropType, CSSProperties } from 'vue';
-declare type Install<T> = T & {
-  install(app: App): void;
-};
-`;
-        const start = 'declare const _sfc_main:';
-        const end = ';\nexport default _sfc_main;\n';
-        let name = Object.keys(input).find((item: string) => item.toLowerCase() === filePath.split('/').slice(-2)[0]);
-        name = name ? name : ' ';
-        const remain = `
-declare module 'vue' {
-  interface GlobalComponents {
-      Nut${name}: typeof _sfc_main;
-  }
-}     
-      `;
-        const inputs = content.match(RegExp(`${start}([\\s\\S]*?)${end}`));
-        const changeContent = inputs && inputs.length ? `${start} Install<${inputs[1]}>${end}${remain}` : content;
-        return {
-          filePath,
-          content: fileContent + changeContent
-        };
-      }
-    })
-  ],
+  plugins: [vue()],
   build: {
     minify: false,
     lib: {

vite.config.build.ts

@@ -1,5 +1,4 @@
 import { defineConfig } from 'vite';
-import dts from 'vite-plugin-dts';
 import vue from '@vitejs/plugin-vue';
 import path from 'path';
 import config from './package.json';