nishimura.clubnishimura.club

Netlify Functionsを使う

作成日
2021-03-25
更新日
2021-03-27

Nuxt.js(SSG)で構成されたプロジェクトにNetlify Functionsを統合していきます。

ディレクトリ構成

netlify-lambdaをインストールします。

yarn add netlify-lambda

サーバレス関数を置くディレクトリを作ります。

mkdir functions

その配下に、hello.jsというファイルを作ります。

touch functions/hello.js

netlifyの構成ファイルを作ります。

touch netlify.toml
. ├── functions/hello.js ├── netlify.toml ├── nuxt.config.js ├── package.json └── yarn.lock

コード

hello.js

exports.handler = async (event, context) => { return { statusCode: 200, body: "Hello, World" } }

package.json

{ "scripts": { "serve": "netlify-lambda serve functions/", } }

netlify.toml

[build] Command = "netlify-lambda build functions/ && nuxt generate --modern=server" functions = "functions/dist" publish = "dist"

※Netlify Functionsは{TARGET}/distにデプロイされます。
https://{DOMAIN}/.netlify/functions/helloにデプロイされます。

ローカル開発

ローカルで起動する。

yarn run serve --port=9001

http://localhost:9001/.netlify/functions/helloから実行できます。

資料

Related

Tags

Netlify
NuxtJS

Share