vue中的devServer:作用
时间: 2024-05-21 15:12:14 浏览: 16
Vue 中的 devServer 主要用于开发时的服务器配置,它可以帮助我们进行开发调试,自动编译和热更新等功能。通过配置 devServer 可以实现代理请求、自定义响应头、设定域名和端口号、启用 HTTPS 等操作。一般情况下,我们会在开发时使用 devServer 来运行本地服务器,方便我们进行代码调试和实时预览。
相关问题
vue中devserver的public报错
如果在使用 Vue 中的 devServer 时出现 public 报错,可能是因为你在配置文件中使用了一个无效的路径。
请确保你在项目根目录下有一个 public 文件夹,并且在 devServer 的配置中使用正确的路径。
例如,在 vue.config.js 中配置 devServer:
```
module.exports = {
devServer: {
public: 'localhost:8080',
},
};
```
这里的 public 配置应该对应你项目中 public 目录的路径,如果你的 public 目录在项目根目录中,则无需在路径前加任何前缀。
vue.config中devServer
vue.config.js 中的 devServer 是用来配置开发服务器的选项,它可以用来配置代理、自定义端口号等选项。具体来说,它包含以下选项:
- host:指定 devServer 的监听地址,默认为 localhost。
- port:指定 devServer 的监听端口号,默认为 8080。
- https:是否启用 https,默认为 false。
- open:是否在启动 devServer 后自动打开浏览器,默认为 false。
- proxy:配置代理,可以将请求转发到其他服务器上。
例如,我们可以这样配置一个代理:
```javascript
module.exports = {
devServer: {
proxy: {
'/api': {
target: 'http://localhost:3000',
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
}
}
}
}
```
这个配置表示,当我们在前端代码中发送以 /api 开头的请求时,devServer 会将请求转发到 http://localhost:3000 上,并将 /api 前缀去掉。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)