用一个hello world项目学习webpack-JavaScript中文网-JavaScript教程资源分享门户

Webpack是一款用于打包JavaScript应用程序的工具，它可以将多个JavaScript文件打包成单个文件。在本文中，我们将使用一个简单的hello world项目来学习Webpack。

步骤1：创建一个基本的hello world项目

首先，我们需要创建一个基本的hello world项目。这个项目将包含一个index.html文件和一个app.js文件。index.html文件将包含一个div元素，而app.js文件将在页面加载时向这个div元素中插入一条消息。

以下是index.html文件的内容：

-- -------------------- ---- -------
--------- -----
------
------
    ------------ -------------
-------
------
    ---- -------------------
    ------- ----------------------
-------
-------

以下是app.js文件的内容：

var message = "Hello, world!";
document.getElementById("message").innerHTML = message;

在浏览器中打开index.html文件，你将看到一条消息：“Hello, world!”。

步骤2：安装Webpack

接下来，我们需要安装Webpack。在终端中执行以下命令：

npm install webpack webpack-cli --save-dev

这会将Webpack及其CLI（命令行界面）安装到项目的开发依赖中。

步骤3：配置Webpack

现在我们需要创建一个Webpack配置文件。在项目根目录下创建一个名为webpack.config.js的文件，并添加以下内容：

const path = require

> 来源：[JavaScript中文网](https://www.javascriptcn.com/post/6807) ，转载请注明来源
[https://www.javascriptcn.com/post/6807](https://www.javascriptcn.com/post/6807)