webpack踩坑 无法解析jquery及webpack-cli
最近在学习Vue,使用到webpack的时候,出现了错误,可能是3和4的版本问题
webpack-dev-server
安装好webpack-dev-server
后,需要在package.json
的scripts
增加代码 "dev": "webpack-dev-server"
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "webpack-dev-server"
},
然后此时报错了~~~The CLI moved into a separate package: webpack-cli
一大堆,一开始没看懂,搜也没搜明白,最后发现好简单,实际就是安装webpack-cli就好了
无法解析jquery Module not found: Error: Can't resolve 'jquery' in 'F:\Study\webpack-study\src'
看到这个有点懵,我都安装了的,然后也能运行起来,结果就是报这个错。
由于
jquery.placholder.min.js
将UMD用作加载策略,因此它认识到它是通过require
- 必需的,并尝试以相同的方式要求使用jQuery:
"object"==typeof module&&module.exports?require("jquery"):jQuery
Webpack查看require("jquery")
并尝试捆绑jQuery库(在node_modules中不存在)
解决方案是将jQuery作为外部添加到您的webpack.config.js
:
{
...
externals: {
// require("jquery") is external and available
// on the global var jQuery
"jquery": "jQuery"
}
}
当模块标记为外部模块时,Webpack不会捆绑该模块,而是使用全局变量。
参考资料:webpack Can't resolve 'jquery'.
em。。。。上边的并不合适。。。
还是使用ProvidePlugin的吧
自动加载模块,而不必到处 import 或 require 。
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery'
})
然后把import的地方干掉...
参考资料:webpackjs ProvidePlugin.
webpack踩坑 无法解析jquery及webpack-cli的更多相关文章
- vue+ vue-router + webpack 踩坑之旅
说是踩坑之旅 其实是最近在思考一些问题 然后想实现方案的时候,就慢慢的查到这些方案 老司机可以忽略下面的内容了 1)起因 考虑到数据分离的问题 因为server是express搭的 自然少 ...
- webpack踩坑--webpack 2.x升级至4.x
一.安装webpack-cli,webpack@4.26.1 1.npm install webpack-cli -D 2.npm install webpack@4.26.1 -D 二.踩坑 执行n ...
- webpack踩坑之路——构建基本的React+ES6项目
转自:http://www.cnblogs.com/ghost-xyx/p/5483464.html webpack是最近比较火的构建工具,搭配上同样比较火的ReacJS与ES6(ES2015)一定是 ...
- 开始更新webpack踩坑笔记
今天开始学习webpack,记录下踩过的坑-zxf
- webpack踩坑之路——图片的路径与打包
转自:http://www.cnblogs.com/ghost-xyx/p/5812902.html 刚开始用webpack的同学很容易掉进图片打包这个坑里,比如打包出来的图片地址不对或者有的图片并不 ...
- webpack踩坑之路 (2)——图片的路径与打包
刚开始用webpack的同学很容易掉进图片打包这个坑里,比如打包出来的图片地址不对或者有的图片并不能打包进我们的目标文件夹里(bundle).下面我们就来分析下在webpack项目中图片的应用场景. ...
- webpack踩坑之旅
1.安装webpack失败问题 错误原因: 这主要是我以普通用户的身份进行webpack的全局安装,权限不够. [普通用户] 说白了就是通过运行window+r+cmd进入的命令行 解决方式: 用管理 ...
- axios踩坑记录+拦截器使用+vue cli代理跨域proxy+webpack打包部署到服务器
1.小小的提一下vue cli脚手架前端调后端数据接口时候的本地代理跨域问题,如我在本地localhost访问接口http://40.00.100.100:3002/是要跨域的,相当于浏览器设置了一道 ...
- 【踩坑】Safari不兼容webpack封装的vue项目
刚完成 Iblog 博客项目,在 chrome 浏览器调试完后,用 Safari 打开网站,页面一直停留在加载状态. 后来网上说这是 Safari 不支持 ES6 所致. 经过搜索,在 github ...
随机推荐
- Journal of Proteome Research | Improving Silkworm Genome Annotation Using a Proteogenomics Approach (分享人:张霞)
题目:Improving Silkworm Genome Annotation Using a Proteogenomics Approach 期刊:Journal of Proteome Resea ...
- Python Django撸个WebSSH操作Kubernetes Pod(下)- 终端窗口自适应Resize
追求完美不服输的我,一直在与各种问题斗争的路上痛并快乐着 上一篇文章Django实现WebSSH操作Kubernetes Pod最后留了个问题没有解决,那就是terminal内容窗口的大小没有办法调整 ...
- Linux_virtualenv常用命令
创建虚拟环境:mkvirtualenv -p python3 虚拟环境名称,创建后默认进入虚拟环境 查看当前虚拟环境安装的python包:pip list 查看已经创建的虚拟环境:workon + 两 ...
- [二分,multiset] 2019 Multi-University Training Contest 10 Welcome Party
Welcome Party Time Limit: 4000/4000 MS (Java/Others) Memory Limit: 524288/524288 K (Java/Others)T ...
- laravel如何实现多用户体系登录
laraveli添加一个或多个用户表,以admin为例. 部分文件内容可能需要根据实际情况修改 创建一个Admin模型 php artisan make:model Admin -m 编写admins ...
- C#获取设备话筒主峰值(实时音频输出分贝量)
1.引用类库NAudio,Git地址 https://github.com/naudio/NAudio 2.添加如下代码和引用: public float GetVoicePeakValue() { ...
- SpringCloud-Nacos/OpenFien/Gateway的基本介绍及快速上手
一.Spring-Cloud-Alibaba-Nacos 注册中心 1.下载.安装 Nacos 下载地址:https://github.com/alibaba/nacos/releases 下载后解压 ...
- coding++:Semaphore—RateLimiter-漏桶算法-令牌桶算法
java中对于生产者消费者模型,或者小米手机营销 1分钟卖多少台手机等都存在限流的思想在里面. 关于限流 目前存在两大类,从线程个数(jdk1.5 Semaphore)和RateLimiter速率(g ...
- Feign客户端实现RPC 调用
1,springcloud 中支持http调用的两种方式,RestTemplate,Feign客户端 2,Feign 客户端是一个声明式(注解方式)http 远程调用工具 3,实现方式如下: 第一步: ...
- Python python 函数参数:可变参数
# 可变参数 '''传入的参数数量是不确定的 ''' '''若是要计算几个数(未知)的平方和 ''' def cal(nums): sum = 0 for num in nums: sum = sum ...