webpack配置ProvidePlugin后,在使用时将不再需要import和require进行引入,直接使用即可。

使用方法:

在webpack.dev.conf.js和webpack.prod.conf.js中添加

 plugins: [
...
new webpack.ProvidePlugin({
'api': 'api'
}),
...
7 ]

使用场景:

将所有接口调用方法放在 src/api/index.js中,在组件中无需import即可调用

相关配置:

在webpack.base.conf.js中添加

  resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
'vue$': 'vue/dist/vue.esm.js',
'@': resolve('src'),
'api': resolve('src/api/index.js'),
}
},

在组件中使用:

 ...
mounted() {
api.getData().then(res => {
this.items = res
}).catch(err => {
console.log(err)
})
},
...

webpack内置模块ProvidePlugin的更多相关文章

  1. webpack 插件 ProvidePlugin 的使用方法和 eslint 配置

    ProvidePlugin:自动加载模块,而不必到处 import 或 require .(点击查看官方文档) 使用方法: 配置 webpack.config.js文件里 plugins 属性 new ...

  2. webpack从什么都不懂到入门

    前言 这篇文章是自己在整理webpack相关的东西时候突发奇想,想总结自己所学知识,也希望能够帮助想学习webpack的同学们,都是入门级别的,大佬请出门右转. 本文的webpack基于webpack ...

  3. Video.js + HLS 在production环境下webpack打包后出错的解决方案

    Video.js是一个非常强大的视频播放库,能在微信下完美提供inline小窗口播放模式,但当涉及到hls格式视频播放时就比较麻烦,出现的数种现象都不好解决. 错误现象:  1.  PC Chrome ...

  4. vue-cli中如何引入jquery

    前言 虽然vue不推荐直接操作DOM,而且也提供了操作DOM的方式.但是在某些时候还是要用到jquery(囧),那么如何在使用vue-cli的时候引入jquery呢? 安装 国内镜像 cnpm 安装 ...

  5. Laravel-mix 中文文档

    镜像地址 : https://segmentfault.com/a/1190000015049847原文地址: Laravel Mix Docs   概览   基本示例 larave-mix 是位于w ...

  6. Webpack4 学习笔记四 暴露全局变量、externals

    前言 此内容是个人学习笔记,以便日后翻阅.非教程,如有错误还请指出 webpack 暴露全局变量 通过 expose-loader 内联配置 在 webpack中配置 每个模块通过注入的方式 通过CD ...

  7. webpack的使用

    1.webpack是什么? 打包前端项目的工具(为项目提高逼格的东西). 2.webpack的基本命令 webpack#最基本的启动webpack命令 webpack-w #提供watch方法,实时进 ...

  8. webpack 使用优化指南

    前言 本文不是webpack入门文章,如果对webpack还不了解,请前往题叶的Webpack入门,或者阮老师的Webpack-Demos. 为什么要使用Webpack 与react一类模块化开发的框 ...

  9. webpack构建vue项目(配置篇)

    最近公司要求用vue重构项目,还涉及到模块化开发,于是乎,我专门花了几天的时间研究了一下webpack这个目前来看比较热门的模块加载兼打包工具,发现上手并不是很容易,现将总结的一些有关配置的心得分享出 ...

随机推荐

  1. C#注冊表操作汇总

    一.注冊表基本知识 1)       结构 键->项->子项->值项(名称.类型.数据) REG_SZ         字符串 REG_BINARY    二进制 REG_DWORD ...

  2. WPF 后台Render线程崩溃, Exception from HRESULT: 0x88980406

    近期遇到一个问题.窗口在Loaded同一时候Resize会出现黑屏或者直接崩溃, 调查发现是WPF后端的Render线程渲染UI到DirectX时崩溃. 硬件环境:WES7 + .Net4.0 关于W ...

  3. sanic官方文档解析之Deploying(部署)和Extension(扩展)

    1,Deploying(部署) 通过内置的websocket可以很简单的部署sanic项目,之后通过实例sanic.Sanic,我们可以运行run这个方法通过接下来的关键字参数 host (defau ...

  4. EasyDarwin开源手机直播方案:EasyPusher手机直播推送,EasyDarwin流媒体服务器,EasyPlayer手机播放器

    在不断进行EasyDarwin开源流媒体服务器的功能和性能完善的同时,我们也配套实现了目前在安防和移动互联网行业比较火热的移动端手机直播方案,主要就是我们的 EasyPusher直播推送项目 和 Ea ...

  5. 九度OJ 1135:字符串排序 (排序)

    时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:1559 解决:807 题目描述: 先输入你要输入的字符串的个数.然后换行输入该组字符串.每个字符串以回车结束,每个字符串少于一百个字符. 如 ...

  6. Windows消息、绘图与多线程

    有一个项目,一旦点下按钮后,用死循环不停的读数据,读出后立刻用可视化的方法显示.如果不采用多线程的方法,程序运行都正确,但无法关闭窗口,不清楚是窗口无法通过关闭按钮来接受Windows消息,还是接受了 ...

  7. Qtree3

    题目描述 给出N个点的一棵树(N-1条边),节点有白有黑,初始全为白 有两种操作: 0 i : 改变某点的颜色(原来是黑的变白,原来是白的变黑) 1 v : 询问1到v的路径上的第一个黑点,若无,输出 ...

  8. java中科学计数法数字转字符串

    开发过程中有可能会遇到很小的数字,在显示过程中就转换成了科学计数法,这种不利于人的观看,于是就有必要转成字符串形式的.so. 将科学计数法的数字转换成字符串: 使用的是java.math的BigDec ...

  9. 测试,测试开发,QA,QM,QC--------- 测试之路勿跑偏

    测试,测试开发,QA,QM,QC可能是测试行业里的细分角色了,加了不少群学习,看到不同人有对自己不同的角色定位.我也做了这挺长时间的测试,也和大部分测试同胞一样,为了一份好的工作学习各种各样的技术,但 ...

  10. 【转载】String和StringBuffer的区别,以及StringBuffer的常用方法介绍

    String与StringBuffer的区别简单地说,就是一个变量和常量的关系.StringBuffer对象的内容可以修改:而String对象一旦产生后就不可以被修改,重新赋值其实是两个对象.Stri ...