Skip to content

WXperia/webpack-mkcert

 
 

Repository files navigation

webpack-mkcert-getter

使用 mkcert 为 webpack https 开发服务提供证书支持。

效果

查看

localhost

127.0.0.1

localhost

快速开始

  1. 安装依赖
yarn add webpack-mkcert
  1. 配置 webpack
const { defineConfig } = require('@vue/cli-service')

const webpackPlugin = require('webpack-mkcert')

module.exports = defineConfig(async () => {
  const https = await webpackPlugin.default({
    source: 'coding',
    hosts: ['localhost', '127.0.0.1']
  })

  return {
    transpileDependencies: true,
    devServer: {
      server: {
        type: 'https',
        options: {
          host: 'localhost',
          ...https,
        },
      }
    },
  }
})

参数

force

是否强制重新生成证书。

autoUpgrade

是否自动升级 mkcert

source

指定 mkcert 的下载源,国内用户可以设置成 coding 从 coding.net 镜像下载,也可以提供一个自定义的 BaseSource

mkcertPath

如果网络受限的话,可以指定一个本地的 mkcert 文件来代替网络下载。

hosts

自定义域名,默认使用 localhost + 本地 ip 列表。

移动端设备使用

为了使证书在移动设备上被信任,你必须安装根证书 rootCA.pem 文件。可以使用 mkcert -CAROOT 命令打印它所在的文件夹。

在 iOS 上,你可以使用 AirDrop 隔空投送,或者用 CA 用电子邮件发给自己,或者从 HTTP 服务器上提供。打开后,你需要在设置>已下载描述文件中安装配置文件,然后对其启用完全信任

对于安卓系统,安装根证书 CA ,然后在你的应用程序的开发构建中启用用户根证书。见 StackOverflow 的答案

显示插件的调试信息

设置环境变量 DEBUG=vite:plugin:mkcert

更新日志

CHANGELOG

原理

使用 mkcert 安装本地 CA 证书,并为 server.https 生成服务端证书。

友情提示

  1. mkcert 保存目录:PLUGIN_DATA_DIR
  2. 卸载 CA 证书:mkcert -uninstall

感谢

About

Provide certificates for webpack https dev service.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 97.7%
  • HTML 1.3%
  • CSS 1.0%