1

这是我的 webpack.config.json。

 var webpack = require('webpack');
    module.exports = {
    context: __dirname + '/src',
    entry: {
     app: './app.js',
     vendor: ['angular', 'angular-ui-router']
    },
   output: {
    path: __dirname + '/js',
    filename: 'app.bundle.js'
   },
   module:{
    loaders: [
      {
        test: /\.scss$/,
        loader: "style!css!sass",
        exclude: /node_modules/
      }
    ],
  },
  plugins: [
    new webpack.optimize.CommonsChunkPlugin("vendor", "vendor.bundle.js")
  ]
};

如何打开热模块更换,我使用的是 webpack-dev-server,这是我的 package.json

{
  "name": "trainingapp",
  "version": "1.0.0",,
  "main": "app.js",
  "scripts": {
    "build": "webpack --bail --progress --profile",
    "server": "webpack-dev-server ./app.js --hot --inline --module-bind --progress --history-api-fallback",
    "start": "npm run server"
  },
  "devDependencies": {
    "angular": "^1.6.0",
    "angular-ui-router": "^0.3.2",
    "css-loader": "^0.26.1",
    "sass-loader": "^4.1.0",
    "style-loader": "^0.13.1",
    "webpack": "^1.14.0",
    "webpack-dev-server": "^1.16.2"
  }
}

目前我需要刷新浏览器以反映代码中所做的更改,我猜启用 hmr 也会触发 css 更改。

4

1 回答 1

0

因为你使用的是 ui-router,所以试试这个加载器Angular Hot Loader

我试过了,除了模板之外它似乎工作。

于 2017-05-14T04:36:45.270 回答