vue devServer
时间: 2023-10-02 10:08:54 浏览: 73
vue dev tool
Vue的devServer是Vue CLI中提供的一个开发服务器配置。它允许你在开发过程中快速启动一个本地服务器以预览和调试你的应用程序。
在Vue项目的根目录下,通过编辑`vue.config.js`文件来配置devServer。以下是一个简单的示例配置:
```javascript
// vue.config.js
module.exports = {
devServer: {
// 指定devServer的host和port
host: 'localhost',
port: 8080,
// 启用热模块替换(HMR)
hot: true,
// 配置代理
proxy: {
// 将/api开头的请求代理到http://localhost:3000
'/api': {
target: 'http://localhost:3000',
secure: false,
changeOrigin: true
}
}
}
}
```
上述配置中,我们指定了devServer的host为localhost,端口为8080。我们还启用了热模块替换(HMR),这样在代码修改时页面会自动刷新,而不需要手动刷新浏览器。
另外,我们还配置了一个代理规则,将以`/api`开头的请求代理到`http://localhost:3000`,这样可以解决前端开发过程中遇到的跨域问题。
通过以上配置,你可以在开发过程中运行`npm run serve`启动开发服务器,然后在浏览器中访问`http://localhost:8080`来预览你的应用程序。
阅读全文