1安裝node.js 
  在cmd 模式下 進行檢視node版本  node -v
  檢視npm 版本   npm -v
2 切換國內
  npm install nrm -g   全域性安裝
3. 檢視nrm 列表 ,預設為npm
   nrm ls
4切換使用的網址
   nrm use taobao
 5 安裝 webpack
  npm install webpack -g
  
6 在專案中配置預設的webpack.config.js檔案

module.exports={
  entry:'./src/main.js',  //指定打包的入口檔案
  output:{
  	path : __dirname+'/dist',  // 注意：webpack1.14.0 要求這個路徑是一個絕對路徑
  	filename:'build.js'
  }
}
 

7  在專案下進行npm init 然後 cssloader  會生成package.json檔案
--save-dev 表示 儲存到json檔案中


8下載css-loader和style-loader來處理css資源的打包工作, npm i css-loader style-loader  --save-dev
webpack.config.js檔案中進行配置
打包css 檔案時,在main.js檔案中使用  require('../static/css/css.js') 進行載入檔案

module.exports={
  entry:'./src/main.js',  //指定打包的入口檔案
  output:{
  	path : __dirname+'/dist',  // 注意：webpack1.14.0 要求這個路徑是一個絕對路徑
  	filename:'build.js'
  },
  module:{
  	loader:[
  		{
  			test: /\.css$/,
  			loader:'style-loader!css-loader'
  		}
  	]
  }
}
 

9 下載 node-sass 會報錯時(由於使用國外資源時間過長) 需要安裝cnpm
安裝方法 npm install cnpm -g


10 打包.sass等.css檔案, cnpm install node-sass  sass-loader  css-loader style-loader --save-dev

module.exports={
  entry:'./src/main.js',  //指定打包的入口檔案
  output:{
  	path : __dirname+'/dist',  // 注意：webpack1.14.0 要求這個路徑是一個絕對路徑
  	filename:'build.js'
  },
  module:{
  	loader:[
  		{
  			test: /\.css$/,
  			loader:'style-loader!css-loader'
  		},
		{
  			test: /\.sass$/,
  			loader:'style-loader!css-loader!sass-loader'
  		}
  	]
	
  }
}
 

11打包less資源 npm install less less-loader css-loader style-loader --save-dev






12 打包url()請求資源
npm install url-loader file-loader --save-dev

其中的loader

loader:[
  		{
  			test: /\.(png|jpg|gif|ttf)$/,
  			loader:'url-loader?limit=40000'  //限制圖片的大小 如果小於40k當做base64位元組,如果大於40k當做檔案儲存到磁盤裡面
  		}
  	]