我需要从 Vue.js 中的 bundle webpack 中排除 js 库

Posted 2023-03-15

【中文标题】我需要从 Vue.js 中的 bundle webpack 中排除 js 库

【英文标题】：I need to exclude js library from bundle webpack in Vue.js

【发布时间】：2020-08-17 04:07:59

【问题描述】：

我需要从 webpack 生成的 bundle 文件中排除一个个人 js 库。 我的库位于 .src/assets/dkv_vueDocumentXRM.js。

我的 App.vue 文件像这样导入库：

import * as XRM from ‘dkv_vueDocumentoXRM’;

然后我将在我的 App.vue 中使用从 dkv_vueDocumentXRM.js 导出的函数，如下所示：

XRM.aFunction();

为了从 bundle 中排除这个库，我在 vue.config.js 中以这种方式将其声明为外部：

externals: 
    dkv_vueDocumentoXRM: path.resolve(__dirname, "src/assets/dkv_vueDocumentoXRM.js"), 

但我在构建时遇到此错误：

来自 Terser 的 dkv_VueDocumento.js 意外令牌：punc (:) [external "C://SOURCES//Vue//document-explorer//src//assets//dkv_vueDocumentoXRM.js":1,0][dkv_VueDocumento.js:654,18] 这个编译错误：ERROR Failed to compile with 1 errors 18:37:47

未找到此依赖项：

** ./node_modules/cache-loader/dist/cjs.js??ref–12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs 中的 dkv_vueDocumentoXRM。 js??ref–0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=script&lang=js&*

要安装它，你可以运行：npm install --save dkv_vueDocumentoXRM

网上没有太多关于如何做到这一点的信息。 请帮忙。

【参考方案1】：

你尝试过延迟加载吗？

XRM = () => import('./my-component')

这样调用时会加载库/组件

【讨论】：

感谢您的回复，但是按照您描述的方式，我的库 dkv_vueDocumentoXRM.js 在构建项目时也将被捆绑和缩小。不想要这种行为。我希望这个文件不要被缩小。