vue-cli 3 动态引入自定义插件

Question

假设我定义了一个插件 src/aaa.js，里面包括客户端所需的一些函数，因为一些问题，这个插件需要动态导入，也就是说现在打包是没有的，我现在需要在 webpack 中引入这个插件，请问如何处理，是在 babel.config.js 中配置还是在 vue.config.js 中配置，如何配置？

在 babel.config.js 似乎可以动态引入插件，但我有些不明其意，如何只在开发环境引入呢？

只在开发环境引入，我倒是知道，用 (process.env.NODE_ENV === 'development') 即可。

Answer 1

不太理解你的需求，能说详细一些么？

打包的时候，用到的代码都会打包进去，你的意思是你要打包没有用到的代码？给谁用呢？还是类似 GA 那种？

Answer 2

我猜测下你的使用场景。
一个组件不是高频使用，你希望点击某个按钮时，临时去获取这个组件的代码，再调用它。

如果我猜的对，可以继续阅读。

function onClick(){
    import('src/aa.js')
        .then(/*拿到模块*/)
        .catch()

}

webpack下，会自动将import()切割为新的模块，比如1.js。