首页 > 代码库 > webpack打包(一)
webpack打包(一)
1.安装webpack打包工具
webpack是使用npm安装
npm install webpack -g //全局安装
在命令行中就可以使用webpack这个命令了。
提示:由于npm安装会去找国外镜像,所以安装国内淘宝cnpm镜像
npm install cnpm -g
以后所有的npm操作都用cnpm命令代替就行!
注:webpack采用的是commonJs规范
使用webpack(一)
calc.js
function add(x, y) { return x + y;}module.exports = { addFun: add};
main.js
var addExport = require(‘./calc.js‘);console.log(addExport.addFun(1, 2));
使用webpack命令打包
webpack main.js build.js //这样就生成了build.js,就可以在html中使用script引入
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title></head><body> <script src="./build.js"></script> </body></html>
完成命令行中的打包!
2用webpack.config.js配置文件
如果只使用命令行,肯定每次都敲很多参数,这样不利于开发,所以如果将这些依赖写入一个配置文件中,每次都使用一个webpack命令就行
webpack.config.js
module.exports = { entry: ‘./main.js‘, output: { filename: ‘./build.js‘ }};
在命令中就只要敲webpack这个命令就能自动生成build.js文件
webpack打包(一)
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。