如何修复 Vue 3 中的“错误：未知选项：devServer”[关闭]答案

【问题标题】：How to fix "Error: Unknown option: devServer" in Vue 3 [closed]如何修复 Vue 3 中的“错误：未知选项：devServer”[关闭]
【发布时间】：2021-04-07 11:25:07
【问题描述】：

我尝试将devServer 配置添加到 babel.config.js 文件（Vue 3 项目）中，但出现此错误。即使我从official site复制原代码，还是报这个错。

错误：

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.

如何解决此错误“未知选项：.devServer”

【问题讨论】：

是的，我使用 vue cli

标签： vue.js webpack webpack-dev-server vue-cli vuejs3

【解决方案1】：

在 Vue CLI 项目中，您的 Webpack 配置位于项目根目录的 vue.config.js 中，而不是 babel.config.js。如果该文件不存在，您应该创建它并将您的 devServer 配置放入其中。

来自the docs：

vue.config.js 是一个可选的配置文件，如果它存在于你的项目根目录（在 package.json 旁边），它将由 @vue/cli-service 自动加载。您也可以使用 package.json 中的 vue 字段，但请注意，在这种情况下，您只能使用与 JSON 兼容的值。

vue.config.js（不是babel.config.js）

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

【讨论】：