This is (an abbreviation of) my webpack config:
const path = require('path');
const webpack = require('webpack');
const src = path.resolve(__dirname, 'src');
const dst = path.resolve(__dirname, 'www');
const node_modules = path.resolve(__dirname, 'node_modules');
module.exports = {
module: {
rules: [
{
test: /\.worker\.js$/,
use: {
loader: 'worker-loader',
options: {
inline: false,
fallback: false,
name: '.' + path.sep + 'js' + path.sep + '[name].js'
}
}
},
{
test: /\.js$/,
loader: 'babel-loader',
options: {
presets: ['es2017', 'es2016', 'es2015' ],
}
},
{
test: /\.scss$/,
use: [{ loader: "style-loader" },
{ loader: "css-loader",
options: {
url: false
}},
{ loader: "sass-loader" }]
}
]
},
context: src,
entry: {
app: '.' + path.sep + 'js' + path.sep + 'app.js',
styles: '.' + path.sep + 'styles' + path.sep + 'styles.scss'
},
output: {
path: dst,
filename: '.' + path.sep + 'js' + path.sep + '[name].js'
}
};
I refer to a worker like this:
import StationWorker from './stations.worker.js';
...
this.stationWorker = new WorkerConnection (new StationWorker ());
When I run my app using node_modules\.bin\webpack-dev-server -d --progress --content-base platforms\browser\www --port 8081, the output tells me that it has generated .\js\stations.worker.js:
Asset Size Chunks Chunk Names
.\js\app.js 15.2 MB 0 [emitted] [big] app
.\js\styles.js 1.07 MB 1 [emitted] [big] styles
...
Child worker:
chunk {0} .\js\stations.worker.js (main) 2.55 MB [entry] [rendered]
However, when my code attempts to load this generated file, I get a 404 error from the server. I've tried various combinations of not including the path in the name, using default settings, and using publicPath to specify the path, all of which have had the same effect.
How do I get worker-loader to generate code that webpack-dev-server is able to serve?