Ben, here’s the webpack.config.watch.js file I’m working with:
const url = require('url');
const webpack = require('webpack');
const BrowserSyncPlugin = require('browsersync-webpack-plugin');
const config = require('./config');
const target = process.env.DEVURL || config.devUrl;
/**
* We do this to enable injection over SSL.
*/
if (url.parse(target).protocol === 'https:') {
process.env.NODE_TLS_REJECT_UNAUTHORIZED = 0;
config.proxyUrl = config.proxyUrl.replace('http:', 'https:');
}
module.exports = {
devServer: {
watchOptions: {
poll: true,
},
},
output: {
pathinfo: true,
publicPath: config.proxyUrl + config.publicPath,
},
devtool: '#cheap-module-source-map',
stats: false,
plugins: [
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoEmitOnErrorsPlugin(),
new BrowserSyncPlugin({
target,
open: config.open,
proxyUrl: config.proxyUrl,
watch: config.watch,
delay: 1500,
}),
],
};
It’s hard to troubleshoot because it’s hard to know what fixes things and what doesn’t. I’ve had sporadic luck by temporarily moving my views folder out of the structure, hard reloading so it stops the the auto reload, and then moving it back in. It works sometimes, other times it just keeps cycling through the page refreshses on-end.
I’ve also dumped my composer files and redone that based on the suggestion here but it didn’t change anything.
FWIW, I had this same issue at a previous job on a different Macbook Pro, but most of our sites were built with Sage 8 so it wasn’t as big of a deal when a site got stuck in a reload loop.
I use Flyhweel’s Local to run it on my machine.
Also, here’s my config file:
{
"entry": {
"main": [
"./scripts/main.js",
"./styles/main.scss"
],
"customizer": [
"./scripts/customizer.js"
]
},
"publicPath": "/wp-content/themes/client-portal",
"devUrl": "http://yesler-client-portal.local",
"proxyUrl": "http://localhost:3000",
"cacheBusting": "[name]_[hash:8]",
"watch": [
"app/**/*.php",
"config/**/*.php",
"resources/views/**/*.php"
]
}