webpack4 loader

//安装webpack及cli工具
npm init -y
npm install webpack --save-dev
npm install webpack-cli --save-dev

//安装dev-serve
npm install --save-dev webpack-dev-server
+   devtool: 'inline-source-map',  //错误定位
+   devServer: {
+     contentBase: './dist',
+     port:9000
+   }
"dev": "webpack-dev-server --open"



//处理css 
npm install --save-dev style-loader css-loader
+   module: {
+     rules: [
+       {
+         test: /\.css$/,
+         use: [
+           'style-loader',
+           'css-loader'
+         ]
+       }
+     ]
+   }


//处理图片
npm install --save-dev url-loader
npm install --save-dev file-loader
{
   test: /\.(png|jpg|gif|svg)$/i,
   use: [{
      loader: 'url-loader',
      options: {
          limit: 10000  //小于以base64加载 大于已dataurl加载
      }
   }]
}


//处理字体 file-loader
+       {
+         test: /\.(woff|woff2|eot|ttf|otf)$/,
+         use: [
+           'file-loader'
+         ]
+       }


//处理csv xml数据 (json node内置处理)
npm install --save-dev csv-loader xml-loader
+       {
+         test: /\.(csv|tsv)$/,
+         use: [
+           'csv-loader'
+         ]
+       },
+       {
+         test: /\.xml$/,
+         use: [
+           'xml-loader'
+         ]
+       }