webpack打包

最新推荐文章于 2022-10-21 00:30:02 发布

weixin_34051201

最新推荐文章于 2022-10-21 00:30:02 发布

阅读量104

点赞数

CC 4.0 BY-SA版权

文章标签： webpack json ViewUI

原文链接：https://juejin.im/post/5c963b6c5188252d805c77e9

webpack

安装

npm init -y

npm install webpack webpack-cli --save-dev
复制代码

查看webpack的版本号

node_modules\.bin\webpack -v
复制代码

查看webpack的帮助

node_modules\.bin\webpack -h
复制代码

--mode 设置开发环境还是生产环境

--entry 设置打包入口（我要将那个文件打包）

--progress 在打包过程中出现百分比进度

--output 设置打包出口（打包生成的文件）

命令行打包

node_modules\.bin\webpack "./src/main.js" --output="./dist/main.js"
复制代码

package.json里面scripts里面写一个build属性

node_modules.bin\webpack './src/main.js' --output='./dist/main.js' --mode='development' --prog ress --watch

引入

然后在根目录建一个index.html,在html里面引入

--progress(监听进度)和--watch（dist里面数据变化一次,然后就监听一次)

node_modules.bin\webpack './src/main.js' --output='./dist/main.js' --mode='development' --progress --watch

在package.json中配置scripts脚本

{ "name": "init", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo "Error: no test specified" && exit 1", "build":"webpack --progress --color --mode=development" }, "keywords": [], "author": "", "license": "ISC", "devDependencies": { "webpack": "^4.29.6", "webpack-cli": "^3.3.0" } }

转载于:https://juejin.im/post/5c963b6c5188252d805c77e9