简单的webpack配置文件

package.json

{
  "name": "test",
  "version": "1.0.0",
  "description": "no description 2017",
  "main": "index.js",
  "scripts": {
    "test": "run"
  },
  "keywords": [
    "none"
  ],
  "author": "lee",
  "license": "ISC",
  "devDependencies": {
    "babel-core": "^6.23.1",
    "babel-loader": "^6.3.2",
    "babel-preset-es2015": "^6.22.0",
    "babel-preset-react": "^6.23.0",
    "css-loader": "^0.26.2",
    "json-loader": "^0.5.4",
    "style-loader": "^0.13.2"
  }
}


webpack.config.js

module.exports = {
  entry:  __dirname + "/app/main.js",//已多次提及的唯一入口文件
  output: {
    path: __dirname + "/public",//打包后的文件存放的地方
    filename: "bundle.js"//打包后输出文件的文件名
  },
  module: {//在配置文件里添加JSON loader
    loaders: [
      {
        test: /\.json$/,
        loader: "json-loader"
      },
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel-loader',
        query: {
          presets: ['es2015','react']
        }
      },
      {
        test: /\.css$/,
        loader: 'style-loader!css-loader'//添加对样式表的处理
      }
    ]
  },
  devServer: {
    contentBase: "./public",//本地服务器所加载的页面所在的目录
    historyApiFallback: true,//不跳转
    inline: true//实时刷新
  } 
}

 

修改时间 2018-05-15

声明:本站所有文章和图片,如无特殊说明,均为原创发布。商业转载请联系作者获得授权,非商业转载请注明出处。
随机推荐
HTML textarea 文本输入框
MySQL 字符串截取函数 SUBSTRING_INDEX
JavaScript 表单事件
CSS 图片缩小出现锯齿
JavaScript API 接口
JavaScript 原生拖放
RESTful API 执行 delete 返回204无法获取 Body
HTML input radio 单选按钮