webpack是當前前端最熱門的前端資源模塊化管理和打包工具。
安裝webpack
首先要安裝Node.js,Node.js自帶了軟件包管理工具npm,可以使用npm安裝各種插件。Webpack至少需要Node.js v0.6版本,直接安裝最新版就好了。
1.nodeJs官網,像安裝其他軟件一樣,選擇最新的包進行安裝即可;
2.安裝完成后,window用戶,按住 微軟徽標+R ,打開運行,輸入cmd,打開命令行;
3.輸入
node -v,查看當前nodeJs版本
4.輸入?
npm install webpack -g (-g表示global全局安裝)
C:\Users\...\npm\webpack 為全局webpack所在的文件夾路徑;
5.輸入
webpack -h ,可以進入webpack的幫助界面
6.雖然已經全局安裝了webpack ,但是我們通常還是會在項目中安裝局部的webpack,為了安裝各自需要的模塊;
7.首先cd 到項目目錄,可以鼠標將目標文件夾拖拽到命令窗口
8.如果沒有packjson.json ,則使用npm init 命令創建,packjson.json用來展示依賴資源包的列表等信息,為了方便維護,最好創建此文件
Package.json 屬性說明
name- 包名。
version- 包的版本號。
description- 包的描述。
homepage- 包的官網 url 。
author- 包的作者姓名。
contributors- 包的其他貢獻者姓名。
dependencies- 依賴包列表。如果依賴包沒有安裝,npm 會自動將依賴包安裝在 node_module 目錄下。
repository- 包代碼存放的地方的類型,可以是 git 或 svn,git 可在 Github 上。
main- main 字段是一個模塊ID,它是一個指向你程序的主要項目。就是說,如果你包的名字叫 express,然后用戶安裝它,然后require("express")。
keywords- 關鍵字
9.接下來,局部安裝webpack?
輸入命令:npm install webpack --save-dev
10.如果你想安裝指定版本的webpack ,輸入命令
?npm install webpack@2.2.x --save-dev
11.如果需要使用 Webpack 開發工具,要單獨安裝:
npm install webpack-dev-server --save-dev