当前位置:   article > 正文

使用vite打包插件并上传到npm_vite 打包成一个npm包

vite 打包成一个npm包

接上文,目前这个组件库是已经初步上线了,昨晚弄了一晚的打包问题,今天上午优化了点东西

开源仓库:https://gitee.com/li-hanming/wind-slayer-ui 别问为什么不用github,问就是上不去

https://gitee.com/li-hanming/wind-slayer-uiicon-default.png?t=M5H6https://gitee.com/li-hanming/wind-slayer-ui现在来说一说问题和经验总结

1.打包出来的css和js分离了,导致样式会消失,需要手动引入:

翻了资料说在配置的时候加上一句cssCodeSplit: false就可以,但有时候好像没用。。

如果这个没用的话就下载一个插件vite-plugin-libcss使用就好了

2.下载后引入编译器会报错,但实际不影响,这个是ts的问题,需要引入类型声明文件xxx.d.ts

我这里下载了一个插件可以自动生成d.ts文件vite-plugin-dts

但生成后还是不行,要把生成的index.d.ts放到项目文件夹里面再一起打包上传就好了

就是和package.json 哪些放一起

3.更新这个插件再上传需要先打包然后再发布,有时候会忽略掉打包这一步骤直接上传了,我就试过几次。。,所以我给原先的打包脚本增加了一些东西使他可以一键打包然后上传

  1. async function delLib() {
  2. await exec(`del /F /S /Q lib`)
  3. await exec(`rd /S /Q lib`)
  4. }
  5. const buildLib = async () => {
  6. await buildAll()
  7. }
  8. async function publish() {
  9. await exec('npm version patch')
  10. // await exec('npm version minor')
  11. // await exec('npm version major')
  12. await exec('npm publish')
  13. }
  14. delLib()
  15. buildLib()
  16. publish().then(res => {
  17. res.kill('SIGHUP')
  18. })

主要是使用了node.js里面的child_process来执行cmd命令,仍有些不足的地方,个人对node.js并不是很深入,只是用他写过个后台,但能用,如果执行失败了那就再来一次。。

其他的部分网上有很多资料了,也不再多说了 

 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/花生_TL007/article/detail/379324
推荐阅读
相关标签
  

闽ICP备14008679号