webpack命令

1、安装nodeJs
2、安装npm,升级用npm install -g npm,全局安装
3、全局安装webpack, npm instsall -g webpack
4、安装依赖项,npm install --save-dev webpack

5、npm install webpack-cli -D

6、npm install @babel/preset-env
7、webpack app/main.js public/webpack.js

20180329
1、npm init
2、npm install --save-dev webpack
3、npm install --save lodash
4、npm install webpack-cli -D
5、npx webpack src/index.js --output dist/bundle.js
6、mode选项可以在webpack.config.js里指定,也可以在webpack cli命令上指定:

development:开发模式,webpack会默认配置常用于开发的参数,如输出运行时的错误信息等
production:产品模式,webpack会默认配置常用语产品构建的餐宿,如压缩代码等

配置文件:
mode: 'development'
mode: 'production'

命令行:
webpack --mode development
webpack --mode production

去掉警告

7、增加webpack.config.js文件,添加入口出口文件
8、添加npx webpack --config webpack.config.js
9、添加
"scripts": {
"build": "webpack"
},

10、npm run build
11、从 JavaScript 模块中 import 一个 CSS 文件,你需要在 module 配置中 安装并添加 style-loader 和 css-loader:

npm install --save-dev style-loader css-loader

12、npm install --save-dev file-loader
13、处理背景和图标这些图片
14、每次清空/dist文件 clean-webpack-plugin
安装 npm install clean-webpack-plugin --save-dev
15、source map module中添加:devtool: 'inline-source-map'
16、webpack-dev-server 为你提供了一个简单的 web 服务器,并且能够实时重新加载
安装 npm install --save-dev webpack-dev-server

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值