webpack-dev-server不会监视我的文件更改
在webpack-dev-server运行时更改我的文件时，不更新软件包的文件。 下面是我的webpack.config.js和package.json文件，你可以从我的npm脚本中看到，我已经解决了在同一命令（ npm run watch & webpack-dev-server --content-base ./ --port 9966 ）：
webpack.config.js：
'use strict'; var ReactStylePlugin = require('react-style-webpack-plugin'); var ExtractTextPlugin = require('extract-text-webpack-plugin'); var webpack = require('webpack'); module.exports = { devtool: 'sourcemap', entry: ['./js/main.js'], output: { filename: 'bundle.js', path: __dirname + '/assets', publicPath: __dirname + '/' }, module: { loaders: [ { test: /\.js$/, loaders: [ ReactStylePlugin.loader(), 'jsx-loader?harmony' ] }, { test: /\.css$/, loader: ExtractTextPlugin.extract('css-loader') } ] }, plugins: [ new ReactStylePlugin('bundle.css'), new webpack.DefinePlugin({ 'process.env': { // To enable production mode: //NODE_ENV: JSON.stringify('production') } }) ] }
的package.json：
{ "name": "reactTest", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "watch": "webpack --watch", "build": "webpack", "web": "npm run watch & webpack-dev-server --content-base ./ --port 9966" }, "author": "", "license": "ISC", "devDependencies": { "css-loader": "^0.10.1", "extract-text-webpack-plugin": "^0.3.8", "jsx-loader": "^0.13.1", "react-style-webpack-plugin": "^0.4.0", "style-loader": "^0.10.2", "url-loader": "^0.5.5", "webpack": "^1.8.5", "webpack-dev-server": "^1.8.0" }, "dependencies": { "react": "^0.13.1", "react-style": "^0.5.3" } }
我的目录结构是：
assets bundle.css bundle.css.map bundle.js bundle.js.map js AppActions.js Profile.css.js ProfileList.js main.js AppConstants.js AppStore.js Profile.js ResultPage.js package.json index.html node_modules webpack.config.js
assets目录内的每个文件都是由webpack生成的
您需要使用–hot标志运行webpack-dev-server：
webpack-dev-server --content-base ./ --port 9966 --hot
然后你可以访问热加载版本localhost：9966 / webpack-dev-server /
你也不需要运行手表。
更新：
webpackconfiguration中的这个条目必须改变：
entry: ['./js/main.js'], entry: ['webpack/hot/dev-server' , './js/main.js'] entry: ['./js/main.js'], – > entry: ['webpack/hot/dev-server' , './js/main.js']
更改您的publicPath条目：
publicPath: '/assets/'
为了让webpack观看我的文件更改（Ubuntu 14.04），我不得不增加观察者的数量（之前增加了数量，但仍然太低）：
echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p
来自官方文档： https ： //webpack.github.io/docs/troubleshooting.html#not-enough-watchers
我首先怀疑是因为fsevents在Ubuntu上不起作用，但是显然情况并非如此。
此外，因为现在观看和重新编译工作，但自动浏览器刷新部分不起作用，我添加了 – 内联参数的@deowk，使“内联模式”的答案： webpack-dev-server --content-base ./ --port 9966 --hot --inline
从官方文档引用：“与webpack-dev-server使用热模块更换最简单的方法是使用内联模式。” 来源： https ： //webpack.github.io/docs/webpack-dev-server.html#hot-module-replacement
我会把这个放在这里，以防万一它帮助任何人。 我的问题是一样的，但由目录名称和webpack别名声明的大小写不一致。
我有一个WebGL目录，我在我的别名引用webgl ，不幸的是这工作的构build，但没有工作的代码观看。
@funkybunky确定了正确的问题，但（恕我直言）修复了错误的方式。 至less在我的情况下，webpack试图监视它使用的每个文件，其中包括从npm拉下的数千个依赖关系文件的深度链。 我把这个添加到我的configuration， 每个文档 ：
devServer: { watchOptions: { ignored: /node_modules/ } }
当然，您可以合理地拥有数千个可能需要监视的文件，在这种情况下，请继续并提高限制，但最好忽略不太可能更改的供应商库。
在我的情况下，错误是由目录名称中的空白空间引起的，通过“RepositoryName”更改“Repository Name”，一切工作正常！
