webpack（二）配置

来源：互联网发布：redhat yum 编辑：程序博客网时间：2024/05/29 18:25

webpack项目配置

之前已经安装过webpack全局环境，下面结合项目看一下打包过程。
首先创建一个静态页面 index.html 和一个 JS 入口文件 entry.js：

<!-- index.html --><html><head>  <meta charset="utf-8"></head><body>  <script src="bundle.js"></script></body></html>

// entry.jsdocument.write('It works.')

然后编译 entry.js 并打包到 bundle.js：

$ webpack entry.js bundle.js

打包过程会显示日志：

Hash: e964f90ec65eb2c29bb9Version: webpack 1.12.2Time: 54ms    Asset     Size  Chunks             Chunk Namesbundle.js  1.42 kB       0  [emitted]  main   [0] ./entry.js 27 bytes {0} [built]

用浏览器打开 index.html 将会看到 It works. 。

接下来添加一个模块 module.js 并修改入口 entry.js：

// module.jsmodule.exports = 'It works from module.js.'

// entry.jsdocument.write('It works.')document.write(require('./module.js')) // 添加模块

重新打包 webpack entry.js bundle.js 后刷新页面看到变化 It works.It works from module.js.

0 0