首页 > 编程知识 正文

开发一套组件库,vue3组件库开发

时间:2023-05-03 10:49:10 阅读:285497 作者:2121

1、不知道是mfsu 有缓存还是umi项目本身就存在缓存问题,如果发现修改后页面未生效可以删除.umi 再重启试试

2、在组件内建example文件夹存放示例代码,在md文件内使用code引入,运行和打包都会报错,提示找不到模块“pro-tea-components”或其相应的类型声明。

Cannot find module 'pro-tea-components' or its corresponding type declarations.

(不知道咋么解决,可以加@ts-ignore,但是解决方式不优雅)

2.1 运行报错的解决方案是在umirc.ts中配置alias,指向项目的src

chainWebpack(memo) {    memo.resolve.alias.set(PackageJson.name, '/src');  },

2.2 打包报错的解决方案是

GitHub - umijs/father: Library toolkit based on rollup and babel.

文档说demos 目录不会被编译到 es 和 lib 下

所以把example换成了demos

3、fatherjs打包疑似不走umirc的配置,在umirc配置define的变量,打包是会报找不到变量的错

4、还有一个问题是,在umirc配置的lessLoader

lessLoader: {    globalVars:{       prefix: 'pro-tea'     },     modifyVars: {       hack: 'true; @import "~@/styles/index.less";',     },   },

styles/index.less 里面是一些less变量和less mixins的东东

Fatherjs打包也会提示找不到prefix等less变量的问题

4.1 最后的解决方案是样式文件自己引入[捂脸.jpg]

@import '../../styles/index.less';

4.2 找到一个配置是在fatherrc.ts中配置,可以配置less的全局变量,但是一些全局的mixins的less文件不知道怎么配置,同样配置umirc的modifyVars,不生效

lessInBabelMode: {    globalVars: {      prefix: 'pro-tea',    },    javascriptEnabled: true,  },

5、把react配置在peerDependencies,避免存在两个不同的版本,提示invalid hook call,这里需要在devDependecis中安装react

"peerDependencies": {    "react": "^16.12.0"  },

6、打包后的docs-dist样式不生效,解决方法是在package.json配置sideEffects:true

7、配置babel模式打包,在代码内使用@/引入的,会报找不到模块的错

解决方法是

npm i eslint-import-resolver-babel-plugin-root-import babel-plugin-import babel-plugin-root-import —save-dev

在fatherrc.ts配置

extraBabelPlugins: [ [ 'babel-plugin-root-import', { rootPathSuffix: 'src/‘, rootPathPrefix: ‘@/‘, }, ], ],

在eslint配置

settings: {    'import/resolver': {      'babel-plugin-root-import': {        rootPathSuffix: 'src/‘,        rootPathPrefix: ‘@/‘,      },    },  },

参考掘金

8、在babel打包模式下 使用css modules引入的less文件,build会提示找不到模块声明,但是tscofing是有引入typings.d.ts的,在这个文件中进行了声明,但是不生效,因为gulp打包忽略了.d.ts文件

解决方法是在入口文件添加

/// <reference path="../typings.d.ts" />

build时声明文件typings.d.ts需要在哪里配置 · Issue #48 · umijs/father · GitHub

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。