webpack4 从入门到放弃
2018-07-18 本文已影响0人
风华正茂它爸爸
简单的打包,按照官网例子来的。
- webpack4 倡导本地下载。首先创建packange.json
npm init
- 下载本地webpack和webpack-cli
npm install webpack webpack-cli --save-dev
- 我们的目录结构是这样的
webpack-demo
|- package.json
|- webpack.config.js
|- /dist
|- bundle.js
|- index.html
|- /src
|- index.js
|- sum.js
|- /node_modules
- index.js
import sum from './sum';
function component() {
var element = document.createElement('div');
element.innerHTML = sum(2,3);
return element;
}
document.body.appendChild(component());
- sum.js
export default function (a,b) {
return a+b;
}
- index.html
<!doctype html>
<html>
<head>
<title>qibu</title>
</head>
<body>
<script src="bundle.js"></script>
</body>
</html>
7.package.json
{
"name": "webpack",
"version": "1.0.0",
"private": true, //更改此处
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "webpack"
},
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^4.16.1",
"webpack-cli": "^3.0.8"
},
"dependencies": {
"loadsh": "^1.0.1",
"lodash": "^4.17.10"
},
"description": ""
}
8 运行命令 run build webpack
就会打包生成 bundle.js.