← 返回首页
WebPack基础教程(二)
发表时间:2022-06-21 19:14:15
WebPack环境搭建

1.安装Node.js

Webpack实际是用Node.js写的,所以要先安装Node.js环境。首先进入Node.js的官网,选择对应系统下载安装包:

对于 windows 用户,直接下载安装包安装即可,如果是 Macos 用户,推荐使用 brew 进行安装。

Node.js有很多版本,包括稳定版和开发版,不同的项目需要的Node.js版本不同,推荐大家安装 8.x 以上的版本。

2.NPM包管理工具

简单来说,NPM(Node Package Manager)是包含在Node.js里面的一个包管理工具,NPM会随着Node.js一起安装,我们可以在命令提示符(以下演示的命令均为windows系统环境)中查看NPM的版本:

NPM为开发者提供了一个代码模块共享的大平台,当我们项目中需要使用某个模块(JavaScript包)时,可以直接使用NPM包管理工具来下载对应的包并安装,我们也可以把自己用Node.js写的代码发布到平台上供他人使用。

在搭建一个前端项目之前,通常会在项目的根目录下生成一个名为package.json的文件作为NPM包的描述文件,使用该文件来定义项目信息、配置包依赖关系。package.json文件可以自己手动创建,也可以使用命令来创建:

npm init

在命令提示符中输入上面命令(先 cd 到项目根目录下,再执行命令)后,会向用户提问一系列问题,根据对应的提示回答问题,如果不回答直接输入回车,程序会按照默认选项进行配置。期间使用 -f(表示force)、-y(表示yes)会跳过提问阶段,直接生成一个新的package.json文件。

文件中包含了NPM包的基本信息(项目名称、版本号、项目描述、作者)和依赖管理, 生成的package.json如下:

{
  "name": "com.simoniu",
  "version": "1.0.0",
  "description": "myweb",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "simoniu",
  "license": "ISC"
}