#### npm常用命令:
npm init 在項目中引導創建一個**package.json**文件
npm install 安裝模塊
```
npm install webpack@4.0.1 --save|--save-dev -g
安裝的包寫到package.json的dependencies或devDependencies
如果不指定包名則根據package.json的配置來安裝
-g:??
```
npm uninstall 卸載模塊
npm run dev:執行腳本,dev對應package.json中的scripts
npm update 更新模塊
npm outdated 檢查模塊是否已經過時
npm ls 查看安裝的模塊
npm help 查看某條命令的詳細幫助
npm root 查看包的安裝路徑
npm config 管理npm的配置路徑
npm cache 管理模塊的緩存
npm start 啟動模塊
npm stop 停止模塊
npm restart 重新啟動模塊
npm test 測試模塊
npm version 查看模塊版本
npm view 查看模塊的注冊信息
npm adduser 用戶登錄
npm publish 發布模塊
npm access 在發布的包上設置訪問級別
#### package.json
```json
{
"name": "zyy",
"version": "1.0.1",
"description": "my first demo",
"main": "index.js",
"scripts": {
"dev": "webpack-dev-server --open",
"build": "webpack"
},
"author": "",
"license": "MIT",
"dependencies": {
"css-loader": "^2.1.1"
}
}
```
**webpack**:
安裝webpack:*npm i -webpack*
#### webpack常用命令
```
webpack – building for development
webpack -p – building for production (minification)
webpack --watch – for continuous incremental building
webpack -d – including source maps
webpack --colors – making building output pretty
```
#### webpack.config.js
```javascript
module.exports = {
//單個人口文件
entry: './main.js',
output: {
filename: 'bundle.js'
},
//多個入口文件
entry: {boundle1:'./main1.js',boundle2:'./main2.js'},
output: {
filename: '[name].js'
},
module: {
rules:[
{
test: /\.css$/,
exclude: /node_modules/,
use: [ 'style-loader', 'css-loader' ]
},
],
rules:[
{
test: /\.(png|jpg)$/,
use: [
{
loader: 'url-loader',
options: {
limit: 8192
}
}
]
}
]
}
};
```