技术成神

Appearance

Return to top
本页目录

2023.3的问题

3.3

01.webifiy自动部署vitepress时候nodejs版本不兼容

解决思路:

webifiy中的node版本为14,npm run build会出现

js
Cannot find module 'node:path'

本质上是node版本不能用import方法

解决方案:

在package.json里面添加type

"type": "module"

参考:如何解决node用require报错但用import又报错

3.6

01.vite打包构建组件库按文件夹去拆分

在vite.config.js中配置

js
const config = {
  build:{
    rollupOptions:{
      output: {
        //让打包目录和我们目录对应
        preserveModules: true,
        // 让打包目录的位置 默认是根目录下打包 这样就没有index了,需要配置一下
        preserveModulesRoot: resolve(__dirname, 'ui'), 
      }
    }
}

参考:使用Vite和TypeScript带你从零打造一个属于自己的Vue3组件库

02.vue3强制渲染的思路

this.$forceUpdate()存在于选项式,vue3的组合式就没有对应的api 如果要用强制渲染,通常是对需要强制渲染的的组件加上v-if来判断

03.vue3的script setup语法糖中使用toRefs

js
const data = reactive({
    formValue: {
        cdoe: "",
        sessionCode: "",
    },
});
const { formValue } = toRefs(data);

参考:使用Vite和TypeScript带你从零打造一个属于自己的Vue3组件库

参考: vue3在＜script setup＞中使用...toRefs(两种写法)