Babel和webpack-dev-server不生成编译文件

时间:2018-01-27 23:34:01

标签: webpack webpack-dev-server babel

这是我的webpack.config.js

var path = require('path');

const frontend = {
  entry: [
    './src/js/app.js'
  ],
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')
  },
  node: {
    fs: 'empty'
  },
  module : {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel-loader'
      }
    ]
  },
  stats : {
    colors: true
  },
  devtool : 'source-map'
};

module.exports = [
    Object.assign({}, frontend)
];

这是我的.babelrc

{
  "presets": ["env"]
}

这是我的package.json

{
  "name": "project",
  "version": "1.0.0",
  "description": "",
  "main": "app.js",
  "scripts": {
    "watch": "webpack --progress --watch",
    "serve": "webpack-dev-server"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.1",
    "babel-preset-es2015": "^6.24.1",
    "webpack": "^3.10.0"
  },
  "dependencies": {
  }
}

当我运行npm run serve时,不会在dist文件夹中生成bundle.js文件,但它表示已成功编译。

enter image description here

但是,如果我运行npm run watch,则会在dist文件夹中生成文件

1 个答案:

答案 0 :(得分:0)

webpack-dev-server将捆绑包保存在内存中,并且不会保存在磁盘上。这是设计的。捆绑包不是在开发服务器上提供的。这对于实时重新加载等很容易。

我建议查看他们的文档。 或者只是阅读他们的readme