webpack 3.0

一.package.json配置
1."dev": "webpack-dev-server --config webpack.config.js --inline --hot --progress --colors --port=1000"
npm install --save-dev webpack-dev-server
webpack-dev-server:热更新模块
--port=1000  改变端口号

npm run dev 即可
二.入口和出口文件配置


三.webpack.config.js配置
1.创建文件夹 初始化package.json 下载webpack
  mkdir webpack-demo && cd webpack-demo    npm init -y
    npm install -g webpack
  npm install --save-dev webpack

2.scss

  npm install style-loader css-loader sass-loader node-sass webpack --save-dev
  
  module.exports {
       ...
       module{
           rules[{
               test: /.scss$/,
               use[{
                   loader"style-loader// creates style nodes from JS strings 
               }{
                loader"css-loader// translates CSS into CommonJS 
               }{
                   loader"sass-loader// compiles Sass to CSS 
               }]
           }]
       }
      };
3.使用es6语法
  
npm install --save-dev babel-loader babel-core babel-preset-env

module{
  rules[
    {
      test: /.js$/,
      exclude: /(node_modules|bower_components)/,
      use{
        loader'babel-loader',
        options{
          presets['env']
        }
      }
    }
  ]
}

  
原文地址:https://www.cnblogs.com/wusheng2016/p/7059930.html