根据博客https://www.cnblogs.com/geyouneihan/p/9769808.html学习webpack4中使用ProvidePlugin遇到了自定义js无法使用的问题,解决之后想记录一下。

"presets": [
resolve: {
alias: {
tast$: path.resolve(__dirname, "src/io.js")
}
},

webpack4的取别名的功能,原来import可能地址很复杂,可以使用别名简化,可看官网 https://webpack.js.org/configuration/resolve/#resolvealias

 plugins: [
new webpack.ProvidePlugin({
ta: 'tast',
})
]

常用模块可以减少import的频率,插件的介绍,官网 https://webpack.js.org/plugins/provide-plugin/#root

用loadsh,jquery等第三方库就没有问题,但是自己写的js就有问题

原因是因为我写的js导出用的es6的语法export

 export function tt(){
console.log(12223)
}

而ProvidePlugin插件是使用require的方式来导入的,所以才会出现问题,打包后的源码如图

webpack4 插件ProvidePlugin使用遇到的问题的更多相关文章

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

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

  2. 写webpack插件报警告Tapable.plugin is deprecated. Use new API on .hooks instead解决方案,webpack4插件新写法

    最近写了个小插件报了个警告,然后去百度了一下,全都给我说extract-text-webpack-plugin这个插件有问题要更新,我也是无语了,这个插件我用都没用,百度翻了下齐刷刷全是这个答案,搞得 ...

  3. webpack4入门到进阶案例实战课程

    愿景:"让编程不在难学,让技术与生活更加有趣" 更多教程请访问xdclass.net 第一章 webpack4前言 第一集 webpack4入门到进阶案例实战课程介绍 简介:讲述w ...

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

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

  5. vue-cli项目中引入第三方插件

    前言 最近有小伙伴问道如何在vue-cli项目中引入第三方插件或者库,例如如果想在项目中使用jQuery中的Ajax请求数据呢?或者我想使用Bootstrap框架呢?等等这些问题,本篇博客将带你学习如 ...

  6. 前端MVC Vue2学习总结(二)——Vue的实例、生命周期与Vue脚手架(vue-cli)

    一.Vue的实例 1.1.创建一个 Vue 的实例 每个 Vue 应用都是通过 Vue 函数创建一个新的 Vue 实例开始的: var vm = new Vue({ // 选项 }) 虽然没有完全遵循 ...

  7. webpack.config.js文件的高级配置

    一.多个入口文件之前我们配置的都是 一个入口 var webpack = require('webpack'); var commonsPlugin = new webpack.optimize.Co ...

  8. webpack打包jQuery,jQuery未定义

    怎么来兼容老式jQuery插件 ProvidePlugin + expose-loader / externals 1.ProvidePlugin + expose-loader webpack.co ...

  9. webpack.config.js====引入Jquery库文件

    1. 安装 cnpm install --save jquery expose-loader 2. 在webpack.config.js中配置 Jquery库是使用的webpack的一个插件Provi ...

随机推荐

  1. noip模拟23[联·赛·题]

    \(noip模拟23\;solutions\) 怎么说呢??这个考试考得是非常的惨烈,一共拿了70分,为啥呢 因为我第一题和第三题爆零了,然后第二题拿到了70分,还是贪心的分数 第一题和第二题我调了好 ...

  2. 微信小程序云开发-云存储-获取带图片的商品列表

    一.将商品图片上传至云存储 如下图,已准备5张商品图片,并且已经将商品图片上传至云存储  二.数据库表添加图片字段 在数据库表goods添加字段image,该字段用来存储图片的url信息 image在 ...

  3. Scrapy 爬虫框架学习笔记(未完,持续更新)

    Scrapy 爬虫框架 Scrapy 是一个用 Python 写的 Crawler Framework .它使用 Twisted 这个异步网络库来处理网络通信. Scrapy 框架的主要架构 根据它官 ...

  4. Leetcode:面试题55 - II. 平衡二叉树

    Leetcode:面试题55 - II. 平衡二叉树 Leetcode:面试题55 - II. 平衡二叉树 Talk is cheap . Show me the code . /** * Defin ...

  5. DC-4靶机

    仅供个人娱乐 靶机信息 下载地址:http://www.five86.com/downloads/DC-4.zip 一.主机扫描 arp-scan -l nmap -p 1-65535 -A -sV ...

  6. 关于 IE8 console不未定义的问题

    在开发的过程中由于调试的原因,在代码中加入console.info("xxxx"),而未进行删除 在IE8下测试该代码所在的页面报错,如下: 需要注意的是,使用console对象查 ...

  7. 科普—为什么要用ECDSA加签及其数学上的验签证明

    在上文介绍了ECDSA算法流程及模块划分,为了帮助一些小白弄懂啥是ECDSA,特此开一篇科普博文. 一.首先为啥要进行数字签名? 假设Alice要将一份合同m传输给Bob,合同上附有Alice的电子纸 ...

  8. 迈入 8K 时代,AI 驱动超高清 “视” 界到来

    2021 年,超高清迈入 "8K" 时代.超高清视频将带来全新视听体验,但超高清生产在内容生产层面也面临着超高清存量少.生产设备更新换代慢.制作周期成倍增加的困境.在 7 月 10 ...

  9. BUUCTF-[SUCTF 2019]CheckIn(.user.ini利用+exif_imagetype绕过)

    目录 分析 .user.ini使用条件 解题 参考链接 记一道.user.ini利用+exif_imagetype绕过的文件上传的题. 分析 先正经上传一张图片.回显了存储路径,同时发现还包含了一个i ...

  10. 我一个五年Android开发,居然被一个技术不如我的面试官嫌弃了......

    背景 首先介绍一下自己的情况.目前所在的是一家小的创业公司,待了5年多,薪资一般吧.由于这几年公司也在转型.工作经历大概可以分为 3 个阶段. 第一阶段是从进公司开始做 android app 开发, ...