webpack 4.0 配置方法以及错误解决
选取一个空目录来试验
全局安装webpack4.1之后
创建目录
mkdir webpacktest && cd webpacktes
初始化package.json
npm init -y;
然后文件目录中安装webpack
npm i webpack@next --save-dev @next我也不知道是什么意思
安装cli工具
npm i webpack --save-dev
再在package.json中配置script
"script":{
"build":"webpack"
}
这个时候直接运行webpack肯定是会报错的。之前的版本需要webpack.congfig.js里面配置一大堆东西;
现在不需要了
直接建立你想要的文件
例如./src/index.js
随笔写几句代码 console.log('new webpack 4.0 is so easy');
npm run build
可以看到直接打包好了放在./dist/main.js中
index.js运行结果和main.js一样。说明咱们的操作是对的;庆祝下吧。
之前参考一些文章。例如 :入门webpack这篇文章就够了;按照上面的步骤根本走不下来。
还遇到错误提示
WARNING in configuration
The 'mode' option has not been set. Set 'mode' option to 'development' or 'production' to enable defaults for this environment.
只需要在package.json中添加配置项:
"scripts": {
"dev": "webpack --mode development",
"build": "webpack --mode production"
}
然后npm run dev 这个时候dist里面的文件的不是压缩过的
但是npm run build 这个时候dist的main.js就是压缩了的。哈哈 很高兴吧
webpack 4.0 配置方法以及错误解决的更多相关文章
- 安卓安装提示:Android SDK requires Android Developer Toolkit version 21.1.0 or above. (错误解决方法)
安卓安装提示:Android SDK requires Android Developer Toolkit version 21.1.0 or above. (错误解决方法) 主要是因为版本号不正确 ...
- Linux 出现telnet: 127.0.0.1: Connection refused错误解决办法
Linux 出现telnet: connect to address 127.0.0.1: Connection refused错误解决办法 没有xinetd服务: 1./etc/init.d目录中放 ...
- 史上最详细 Python第三方库添加方法 and 错误解决方法
(1):如何添加python第三方库(方法一): File ->> Settings... ->> Project Interpreter (2):如何添加python第三方库 ...
- ganglia监控hadoop2.0配置方法
ganglia监控hadoop2.0配置方法前提:hadoop2.0集群已安装ganglia监控工具第一步:Hadoop用户登录集群每一个节点,修改文件:vi /opt/hadoop-2.0.0-cd ...
- win10+VS2015+opencv3.4.0配置方法
win10+VS2015+opencv3.4.0配置方法 操作环境: windows10 64位opencv 3.4.0:https://opencv.org/releases.html(选择open ...
- webpack2.0 css文件引入错误解决及图片输出在根目录配置问题
webpack引入css文件,main.js内容如下 import Vue from 'vue'; import App from './App.vue'; import Mint from 'min ...
- webpack 4.0配置2
上个博客记录了webpack 的基本配置今天主要是css-loader的介绍,包括单独提出css,压缩css.js文件 这里使用的插件npm 地址:https://www.npmjs.com/pack ...
- MySQL 8.0安装以及初始化错误解决方法
MySQL 8.0 安装配置及错误排查 官网下载 CentOS7环境下的具体安装步骤 初始化MySQL发生错误的解决方法 忘记数据库root密码 官网下载 mysql官网下载链接:https://de ...
- Target runtime Apache Tomcat v6.0 is not defined.错误解决方法
一.背景 最近在使用本地的tomcat进行运行项目的时候,发现出现了如题所述的问题.不知道什么原因,经过努力解决了该问题. 二.解决步骤 右击项目---选择属性---选择targeted runtim ...
随机推荐
- 【转载】SQL实例大全
from:http://blog.csdn.net/basycia/article/details/52134279 OR from:http://www.cnblogs.com/yubinfeng/ ...
- Linux-本地日志服务管理(rsyslog基础)
目录 系统环境 1.常见的两种日志管理服务 1.1 RSYSLOG系统日志服务 1.2 ELK 2.RSYSLOG日志服务的相关知识 2.1 RSYSLOG日志消息级别 2.2 RSYSLOG日志服务 ...
- AVCaptureSession部分用法
原文链接 AVCaptureSession阻塞主线程问题 前阵子程序中出现了一个奇怪的 bug,在 iOS 系统上,页面弹出的时候会卡很久,相机始终黑屏,大概6-7秒钟,跟踪具体每个步骤花费时间的时候 ...
- centos7 安装 nginx-1.18.0 并设置开机自启动
一.到官网下载nginx Mainline version: nginx主力版本,为开发版 Stable version: 稳定版,在生产环境中选择此版本进行安装 Legacy versions: ...
- Android 12(S) 图形显示系统 - 初识ANativeWindow/Surface/SurfaceControl(七)
题外话 "行百里者半九十",是说步行一百里路,走过九十里,只能算是走了一半.因为步行越接近目的地,走起来越困难.借指凡事到了接近成功,往往是最吃力.最艰难的时段.劝人做事贵在坚持, ...
- @Autowired @Qualifier @Resource
@Autowired 用于对Bean的属性变量,属性的setter()方法及构造方法进行标注,配合对应的注解处理器完成Bean的自动装配工作.默认按照Bean的类型进行装配. @Resource 其作 ...
- vscode使用python虚拟环境
vscode使用python虚拟环境 创建好虚拟环境之后,在vscode中配置使用python的虚拟环境. 首先打开设置,然后搜索python venv, 在python: Venv Path中设置为 ...
- OOS 预览报错解决思路
预览报错解决思路: 官方链接:https://docs.microsoft.com/zh-cn/officeonlineserver/office-online-server :> 查看服务器内 ...
- 通过webgoat-xxe、jwt学习Java代码审计
WebGoat-JWT JWT Tokens 01 概念 本课程将介绍如何使用JSON Web Token(JWT)进行身份验证,以及在使用JWT时需要注意的常见陷阱. 目标 教授如何安全地实现令牌的 ...
- Spring对DAO的支持?
Spring对数据访问对象(DAO)的支持旨在简化它和数据访问技术如JDBC,Hibernate or JDO 结合使用.这使我们可以方便切换持久层.编码时也不用担心会捕获每种技术特有的异常.