nuxt.jsのdevelopをhttpsで立ち上げる

AmazonPayやFacebookのoauthはhttpsが必須ですが、nuxt.jsのdevelopではhttpで立ち上がってしまうため、組み込みができません。

以下のようにコマンドでwatchしながらbuildできればnginxでホスティング…と思いますが実装の方針はないようです。

$ nuxt build --watch

いろいろ調べて起動用のスプリクト書いたりしましたが、普通に公式の方法がありました。

SSL証明書を作成する

mkcertのインストール

$ brew install mkcert

localCAを作成

$ mkcert -install

証明書作成

$ mkcert localhost

証明書を配置する

server/localhost.pem
server/localhost-key.pem

nuxt.confid.jsに設定を追加

server: {
        https: {
            key: fs.readFileSync(
                path.resolve(
                    __dirname,
                    'server/localhost-key.pem'
                )
            ),
            cert: fs.readFileSync(
                path.resolve(__dirname, 'server/localhost.pem')
            )
        }
    }

開発環境環境立ち上げ

$ yarn run dev

おしまい

serverプロパティはdev環境でも有効なんですね
ついでにこの環境だとchromeにhttpsエラーも表示されないのでとても快適です。