在PHP laravel框架中使用webpack和react不能进行热更新吗?
只是手动编译的刷新。
如果我访问http://localhost:8080/webpack-dev-server/,显示无法获取。我不知道为什么?
如果我在PHP laravel框架中不使用webpack和react。一切都很好。
这是我的package.json和webpack.config.js
var path = require('path');
var webpack = require('webpack');
module.exports = {
entry: [
'webpack/hot/dev-server',
'webpack-dev-server/client?http://localhost:8080',
path.resolve(__dirname, './public/js/asset/test.js'),
],
output: {
path: './public/js/home',
filename: "index.js"
},
module: {
loaders: [
{
test: /'.jsx?$/,
loader: 'babel',
exclude: /node_modules/,
loader: 'babel-loader',
query: {
presets:['react','es2015']
}
},
{
test: /'.css$/,
loader: 'style!css'
},
{
test: /'.scss$/,
loader: 'style!css!sass'
},
{
test: /'.(png|jpg)$/,
loader: 'url?limit=25000'
},
{
test: /'.woff$/,
loader: 'url?limit=100000'
}
]
},
plugins: [
new webpack.NoErrorsPlugin(),
new webpack.HotModuleReplacementPlugin()
]
};
试试这个方法,我发现其实很简单。
-
打开webpack.mix.js并在底部添加:
mix.browserSync('localhost:8000');
里面的参数取决于你的php手工服务url和端口。
- 运行
npm run watch
以安装browserSync方法所需的依赖项 - 运行
php artisan serve
和npm run watch
(在不同的cmd上)
希望得到帮助。
如果是工作,别忘了鼓掌。
来源:https://medium.com/@michael.tandio/easy-setp-hot-loader-for-react-laravel-with-laravel-mix-8f68a1393624