Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Learn more about Collectives

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Learn more about Teams

Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem . This will help others answer the question.

Closed 2 years ago .

I tried to add a devServer configuration into the babel.config.js file (Vue 3 project) and I get this error. Even when I copy the original code from the official site , it still reports this error.

The error:

Error: Unknown option: .devServer. Check out https://babeljs.io/docs/en/babel-core/#options for more information about options.
at throwUnknownError (/Users/aman/Desktop/Vue/vue01/node_modules/@babel/core/lib/config/validation/options.js:124:27)
at /Users/aman/Desktop/Vue/vue01/node_modules/@babel/core/lib/config/validation/options.js:109:5
at Array.forEach (<anonymous>)
at validateNested (/Users/aman/Desktop/Vue/vue01/node_modules/@babel/core/lib/config/validation/options.js:85:21)
at validate (/Users/aman/Desktop/Vue/vue01/node_modules/@babel/core/lib/config/validation/options.js:76:10)
at /Users/aman/Desktop/Vue/vue01/node_modules/@babel/core/lib/config/config-chain.js:200:34
at cachedFunction (/Users/aman/Desktop/Vue/vue01/node_modules/@babel/core/lib/config/caching.js:62:27)
at cachedFunction.next (<anonymous>)
at evaluateSync (/Users/aman/Desktop/Vue/vue01/node_modules/gensync/index.js:251:28)
at sync (/Users/aman/Desktop/Vue/vue01/node_modules/gensync/index.js:89:14)error Command failed with exit code 1.

How can I fix this error "Unknown option: .devServer"

In a Vue CLI project, your Webpack configuration goes in vue.config.js in your project root, not babel.config.js. If that file doesn't exist, you should create it and put your devServer configuration in it.

From the docs:

vue.config.js is an optional config file that will be automatically loaded by @vue/cli-service if it's present in your project root (next to package.json). You can also use the vue field in package.json, but do note in that case you will be limited to JSON-compatible values only.

vue.config.js (Not babel.config.js)

module.exports = {
  devServer: {
    // Your configuration goes here