vue webpack 自定义依赖库 避免二次编译构建?

  • Z时代
  • 2024-02-29
  • 分类：IT

我有一个vue-cli3创建的vue2项目，根据我的业务需求用到了一个富文本编辑器，同时根据需要这个编辑器不能使用官方已经构建好的版本

需要我安装编辑器相关的各个功能依赖自定义构建整个过程

我为了考虑后期方便升级把整个编辑器相关的源码写在了src/components某个文件夹中(这个文件夹中有package.json src webpack.config.js等相关文件
相当于我把vue项目用到的某个依赖库没有用node_module文件夹下的某个依赖 而是自己在我的源码中写的依赖库)

以后哪个组件要用编辑器直接用我自定义构建好的这个编辑器js文件就行(src/components/custom-editor/build/editor.js)

我担心我在npm run serve/build整个vue项目时是否会出现build/editor.js被二次构建的过程 如何避免？还有我这种维护方式是否合理？

回答：

短期维护下面这种直接排除：

vue.config.js文件：

module.exports = {
  chainWebpack: config => {
    config.module
      .rule('js')
      .exclude
      .add(/src\/components\/custom-editor\/build/)
  }
}

回答：

二次构建，src/components/custom-editor/build/editor.js 是打包后的产物么？不是的的话，你整个项目发包不是运行一次 build 就足够了么？

维护方式优化
1、项目引用编辑器只能通过编辑器打包后生成的入口文件
2、直接发包到 npm ，害怕公司机密的话，联系运维设立私服，发布的单独账号上。

回答：

构建好的editor.js放到static目录中
vue组件在 mounted 中使用 scriptjs 加载 BASE_URL + static/editor.js
加载完成后即可使用window上的变量初始化ref的dom元素

以上是 vue webpack 自定义依赖库 避免二次编译构建? 的全部内容， 来源链接： utcz.com/p/935033.html

回到顶部