使用 CLI 操作 Webpack

建立一个新的专案资料夹,并初始化 npm 专案:
http://img2.58codes.com/2024/201635225AkZtLOObO.png

2.** 安装 Webpack 和 Webpack CLI 作为开发相依性:**
http://img2.58codes.com/2024/201635225Rz4r7JI4B.png

建立一个简单的 JavaScript 档案(例如index.js),其中编写了您的程式码。

建立一个 Webpack 设定档(例如webpack.config.js),在其中设定 Webpack 的行为。
http://img2.58codes.com/2024/20163522hg8SuRMAqm.png

在package.json文件中新增一个NPM脚本,方便轻鬆执行Webpack。例如:
http://img2.58codes.com/2024/20163522WgjnAf4LPn.png

使用 Webpack CLI 来建立您的专案。在终端机中,执行以下命令:
http://img2.58codes.com/2024/20163522odKmyDTQ7G.png

在dist资料夹中会产生一个bundle.js文件,其中包含了你的JavaScript程式码及其相依性的压缩结果。

建立一个HTML档案(例如index.html),在其中引入产生的bundle.js档案:
http://img2.58codes.com/2024/20163522x6TretkzTf.png


关于作者: 网站小编

码农网专注IT技术教程资源分享平台,学习资源下载网站,58码农网包含计算机技术、网站程序源码下载、编程技术论坛、互联网资源下载等产品服务,提供原创、优质、完整内容的专业码农交流分享平台。

热门文章