vue(typescript)全局引入lodash
全局引入lodashProvidePlugin是Webpack用来自动加载模块的方法,全局使用方式可以避免每个vue组件中都import lodash。npm i lodash--s // 安装lodash1、webpack.base.conf.jsmodule.exports = {context: path.resolve(__dirname, '../'),ent...
全局引入lodash ProvidePlugin
是Webpack
用来自动加载模块的方法,全局使用方式可以避免每个vue
组件中都import lodash
。
npm i lodash --s // 安装lodash
1、webpack.base.conf.js
module.exports = {
context: path.resolve(__dirname, '../'),
entry: {
app: './src/main.js',
login: './src/login.js',
vendor: 'lodash', // 多个页面所需的公共库文件,防止重复打包带入
},
.........
在webpack.dev.conf.js文件中的plugins增加(有试过直接在webpack.base.conf.js中添加,但是加完之后就报错了):
//全局引入lodash ProvidePlugin是webpack的内置模块,使用ProvidePlugin加载的模块在使用时将不再需要import和require进行引入
new webpack.ProvidePlugin({
_: 'lodash'
})
若是使用js那么按以上配置就可以全局使用了,若使用的是typescript,则还要继续配置
在src目录下的shims-vue.d.ts中添加
import * as lodash from 'lodash';
declare global { // 全局变量设置
const _: typeof lodash
}
若不加上面的配置会报错:
TS2686: '_' refers to a UMD global, but the current file is a module. Consider adding an import instead.
至于shims-vue.d.ts是啥,使用了ts就造了
更多推荐
所有评论(0)