Multiple bugs in one (config-yargs is needed and invalid configuration object errors) #2958
Comments
|
Because you need move |
|
Ah. Thanks. |
How should I do that? I'm new to webpack and the docs don't seem to help so I'm lost with doing this change |
|
Oh, I see, we will update logs in near future |
|
Thanks! Hopefully that resolves my issue |
|
The docs still (incorrectly) mention
|
Why not write to types? |
The documentation still hasn't been updated and the change notes aren't clear on where this option now goes. This comment saved me <3 My config now looks like this: Hope this saves someone else a few hours of headaches! |
|
The config has again been renamed in webpack dev-server 4.0.0-beta.3: https://github.com/webpack/webpack-dev-server/blob/master/CHANGELOG.md#400-beta3-2021-05-06 Specifically, I am posting to this thread as I begun my investigation of the issue here, likely others will do the same. |
I met as following: [webpack-cli] Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
- options has an unknown property 'contentBase'. These properties are valid:
object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, http2?, https?, ipc?, liveReload?, onAfterSetupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, setupExitSignals?, static?, watchFiles?, webSocketServer? }
According to webpack/webpack-dev-server#2958 (comment),
'contentBase' doesn't work anymore and was replaced by 'static'
|
Hello, Thank you all for your comments but here I'm with the same issue. How can I convert this "old" configuration file to the new one? const {merge} = require('webpack-merge');
const common = require('./webpack.common.js');
const path = require('path');
module.exports = merge(common, {
mode: 'development',
devtool: 'inline-source-map',
devServer: {
contentBase: path.join(__dirname, './dist'),
compress: true,
watchContentBase: true,
historyApiFallback: true,
https: false,
open: 'Firefox Developer Edition',
stats: {
colors: true,
},
port: 9002,
proxy: {
'/api': 'http://localhost:9000'
},
writeToDisk: true,
},
}); |
|
Wrap the writeToDisk: true; line in a function labelled devMiddleware: like sodevMiddleware: { writeToDisk: true;}Sent from my Galaxy
-------- Original message --------From: Yohan Dunon ***@***.***> Date: 2021-09-25 1:10 p.m. (GMT-04:00) To: webpack/webpack-dev-server ***@***.***> Cc: "Colton G. Rushton" ***@***.***>, Author ***@***.***> Subject: Re: [webpack/webpack-dev-server] Multiple bugs in one (config-yargs
is needed and invalid configuration object errors) (#2958)
Hello, Thank you all for your comments but here I'm with the same issue.
How can I convert this "old" configuration file to the new one?
const {merge} = require('webpack-merge');
const common = require('./webpack.common.js');
const path = require('path');
module.exports = merge(common, {
mode: 'development',
devtool: 'inline-source-map',
devServer: {
contentBase: path.join(__dirname, './dist'),
compress: true,
watchContentBase: true,
historyApiFallback: true,
https: false,
open: 'Firefox Developer Edition',
stats: {
colors: true,
},
port: 9002,
proxy: {
'/api': 'http://localhost:9000'
},
writeToDisk: true,
},
});
—You are receiving this because you authored the thread.Reply to this email directly, view it on GitHub, or unsubscribe.
|
Thank you for your answer @coltongit! It's the only option that needs to be wrapped in another object key? |
|
There may be more that needs wrapped in the same devMiddleware function, check the docs |
|
==I'm sorry to bother you but can you provide a link where I can find this information?== I think I've found the solutions. Complete devServer options here : Thank you all! |
I created a repo from the template, but when I ran yarn start it gave me an error saying that contentBase is an unknown property. Apparently this has been renamed to the property "static", and when I changed the code to this, it fixed the error. I haven't looked into it that much though, so I'm not sure if this is definitely the correct fix for what you guys intended These are the links I read: https://gist.github.com/johnrichardrinehart/c8ec6ab1e60f39fc3b8dc738db649ec0 webpack/webpack-dev-server#2958 (comment) https://stackoverflow.com/questions/67926476/webpack-dev-server-config-contentbase-not-working-in-latest-version https://stackoverflow.com/questions/70309830/webpack-dev-server-config-contentbase-not-working
I created a repo from the template, but when I ran yarn start it gave me an error saying that contentBase is an unknown property. Apparently this has been renamed to the property "static", and when I changed the code to this, it fixed the error. I haven't looked into it that much though, so I'm not sure if this is definitely the correct fix for what you guys intended These are the links I read: https://gist.github.com/johnrichardrinehart/c8ec6ab1e60f39fc3b8dc738db649ec0 webpack/webpack-dev-server#2958 (comment) https://stackoverflow.com/questions/67926476/webpack-dev-server-config-contentbase-not-working-in-latest-version https://stackoverflow.com/questions/70309830/webpack-dev-server-config-contentbase-not-working
Code
Expected Behavior
Webpage compiles successfully and shows the webpage running on the local server.
Actual Behavior
Describing the bugs
First two bugs: Using
npm run appwithwebpack dev-server4.0.0-beta.0 results in an invalid configuration object error, which happens twice for two separate entries in thedevServer:entry inwebpack.config.js. This entry is written above.Third and final bug: Using
npm run appwithwebpack dev-server3.11.1 results in an error that config-yargs is needed.Last known good configuration will be shown later in this bug report.
Both properties used as part of the first 2 bugs are in fact valid API properties in webpack, which seem to not be recognized by the latest 4.0.0 beta or by 3.11.1. Would love to see both a stable 3.11.x release and 4.0.0 beta release that has all of these bugs fixed, thus why this bug report exists.
To reproduce the bugs:
Make a test webpage that utilizes SASS, HTML, and JS that imports the SASS, and try to compile them with the below configurations using
webpack-dev-server --open.The first bug shows as this:
The second as this:
And the third as this:
For Bugs; How can we reproduce the behavior?
Use this list of developer dependencies to trigger the first two bugs:
And this list to trigger the third bug:
The last known good configuration (i.e. what can be used as a control for what the results SHOULD look like) is this:
For Features; What is the motivation and/or use-case for the feature?
Not a feature, therefore no motivation and/or use-cases needed here.
The text was updated successfully, but these errors were encountered: