Javascript 反应热重新加载不工作
我正在尝试使用插件来启用热Relad。但是热重新加载不起作用,当我刷新页面时,更改会在没有构建的情况下反映出来,但它不是实时的。我认为当我在jsx上保存更改时,它应该实时反映在html上,对吗?如果我错了,请纠正我 我的jsx文件Javascript 反应热重新加载不工作,javascript,reactjs,babeljs,livereload,hot-reload,Javascript,Reactjs,Babeljs,Livereload,Hot Reload,我正在尝试使用插件来启用热Relad。但是热重新加载不起作用,当我刷新页面时,更改会在没有构建的情况下反映出来,但它不是实时的。我认为当我在jsx上保存更改时,它应该实时反映在html上,对吗?如果我错了,请纠正我 我的jsx文件 import { hot } from 'react-hot-loader' @observer class ListingComponent extends Component { render() { ......... } } export def
import { hot } from 'react-hot-loader'
@observer
class ListingComponent extends Component {
render() {
.........
}
}
export default hot(module)(ListingComponent);
//global function to run from other frameworks
window.WB.react.renderListingComponent = function() {
render(
<ListingComponent/>,
document.getElementById('node')
);
}
my webpack.config.js
var webpack = require('webpack');
var path = require('path');
// var BUILD_DIR = path.resolve(__dirname, 'src/public');
var BUILD_DIR = path.resolve(__dirname, '../assets/js');
var APP_DIR = path.resolve(__dirname, 'src/app');
var config = {
resolve: {
extensions: ['.js', '.jsx']
},
entry: APP_DIR + '/index.jsx',
output: {
path: BUILD_DIR,
filename: 'bundle.js',
},
module : {
loaders : [
{
test : /\.jsx?/,
include : APP_DIR,
loader : 'babel-loader',
options: {
// This is a feature of `babel-loader` for Webpack (not Babel itself).
// It enables caching results in ./node_modules/.cache/babel-loader/
// directory for faster rebuilds.
cacheDirectory: true,
plugins: ['react-hot-loader/babel'],
},
}
]
}
};
module.exports = config;
网页包服务器命令
npm run dev --watch --hot ----output-public-path=/assets/js/ --inline
试一试
尝试清除节点缓存。重复:能否尝试在webpack.config.js中使用web包热模块加载程序?将
插件:['react-hot-loader/babel'],
替换为插件:[新建网页。HotModuleReplacementPlugin()]
试试看
npm run dev --watch --hot ----output-public-path=/assets/js/ --inline
echo 999999 | sudo tee /proc/sys/fs/inotify/max_user_watches