I have a webapp, A, which I'm building with webpack 2. I also have a library, L, which I'm also building with webpack 2; A imports L to do its job. So far so good.
I run into trouble when attempting to use require.ensure() in my library to code-split out a pretty large dependency that's only used in certain code paths. Webpack appears to build the library correctly, and I see an extra chunk emitted to my library's output directory, but when I run webpack-dev-server to serve up my app I get browser console errors complaining that chunk loading failed:
GET http://localhost:8081/0.index.js 404 Error: Loading chunk 0 failed. at HTMLScriptElement.onScriptComplete 0.index.js is indeed the library chunk containing my big fat dependency. setting output.chunkFilename in my library's webpack config did change the URL of the HTTP request made to webpack-dev-server, but still resulted in a 404:
GET http://localhost:8081/library-chunk-0.js I'm using this webpack config for my library:
{ entry: './src/index.js', module: { rules: [{ test: /\.js$/, loader: 'babel-loader' }] }, output: { chunkFilename: 'library-chunk-[name].js', filename: 'index.js', library: 'my-library', libraryTarget: 'commonjs2', path: path.resolve(__dirname, 'dist'), publicPath: '/' } } There are no chunks of my library in my webapp's output directory. How do I get all chunks of my library to be made available in my webapp's output directory, so that they can be served up by webpack-dev-server (and therefore be present when I distribute the webapp)?
1 Answers
Answers 1
webpack-dev-server, doesn't store bundle files on the disk, but serves them on the fly. So you won't be able to find them in your dist directory, and that's not the problem.
I noticed that you specify output.library and output.libraryTarget on your config object.
Since you are building an application and those are special configurations for authoring libraries, you probably don't need them. Try to remove them, since they fit a different scenario than async chunks and might conflict.
0 comments:
Post a Comment