Vue3跨域配置devServer参数的方法是什么 您所在的位置:网站首页 延迟启动设置什么意思 Vue3跨域配置devServer参数的方法是什么

Vue3跨域配置devServer参数的方法是什么

2023-05-22 07:05| 来源: 网络整理| 查看: 265

devServer 是一个用于配置开发服务器的选项对象。它可以用来配置服务器的各种选项,例如代理,端口号,HTTPS 等。

以下是一些常用的 devServer 参数和设置:

port:指定开发服务器的端口号,默认为 8080。

host:指定开发服务器的主机名,默认为 localhost。

https:开启 HTTPS,可以传入一个 Object 类型的参数,用于配置 HTTPS 选项。

open:自动打开浏览器,默认为 false。可以传入一个 String 类型的参数,用于指定浏览器的名称。

proxy:用于配置代理。可以传入一个 Object 类型的参数,用于配置代理选项。

hot:启用热重载,默认为 true。

compress:启用 gzip 压缩。

historyApiFallback:启用 HTML5 历史模式路由。当浏览器访问的路径不存在时,将返回 index.html 文件,而不是 404 页面。

publicPath:指定资源的公共路径,可以是一个相对路径或绝对路径。

quiet:禁用所有输出信息。

clientLogLevel:指定在浏览器控制台中显示的日志级别,默认为 info。

overlay:在浏览器中显示编译错误。

watchOptions:用于配置监视文件的选项。

contentBase:指定静态文件的目录,默认为项目根目录。

before 和 after:在服务器启动之前或之后执行自定义代码。

下面是一个 devServer 的配置示例:

// vue.config.js module.exports = { devServer: { port: 8080, host: 'localhost', https: false, open: true, proxy: { '/api': { target: 'http://localhost:3000', changeOrigin: true } }, hot: true, compress: true, historyApiFallback: true, publicPath: '/', quiet: true, clientLogLevel: 'warning', overlay: true, watchOptions: { poll: false }, contentBase: './public', before: function(app) { // 在服务器启动之前执行自定义代码 }, after: function(app) { // 在服务器启动之后执行自定义代码 } } };登录后复制

在这个示例中,我们做了以下配置:

将开发服务器的端口号设置为 8080。

将开发服务器的主机名设置为 localhost。

禁用 HTTPS。

自动打开浏览器。

配置代理,将所有以 /api 开头的请求代理到 http://localhost:3000。

启用热重载。

启用 gzip 压缩。

启用 HTML5 历史模式路由。

指定资源的公共路径为根目录。

禁用所有输出信息。

将日志级别设置为 warning。

在浏览器中显示编译错误。

监视文件的选项设置为默认值。

指定静态文件的目录为 ./public。

在服务器启动之前和之后执行自定义代码。

您可以根据自己的需求来配置 devServer。这个示例仅仅是一个起点,您可以根据自己的需求进行修改和扩展。

以上就是Vue3跨域配置devServer参数的方法是什么的详细内容,更多请关注php中文网其它相关文章!



【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有