Vue CLI 搭建本地https调试

背景

我本地通过vue cli 创建并构建完成一个webrtc音视频项目,想要将该项目搭建在本地服务器,这样在同个网络(局域网)下的用户能否正常访问并使用我的项目,但由于webrtc的限制,必须要https才能正常使用,所以为解决这个问题,我使用到了vue cli 提供的 devServer 来挂载https服务。

实现方式

在项目根目录下,新建 vue.config.js 文件,然后新增一下代码,保存,从新运行项目即可,npm run serve

vueconst internalIp = require('internal-ip');  // 引入该模块主要是用于获取当前IP地址,将项目地址设置为当前IP地址,这样同个IP端下的用户可以直接访问我的项目

module.exports = {
    devServer: {
        contentBase: "./dist", //本地服务器所加载的页面所在的目录
        historyApiFallback: true, // 不跳转
        inline: true, // 实时刷新
        https: true, // 开启https
        port: 9999, // 端口号
        host: internalIp.v4.sync(),  // 项目地址
    }
};
image.png
image.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容