22
19

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Serverless Webpack の使い方まとめ

Last updated at Posted at 2016-12-27

Serverless Webpack は Serverless フレームワークを用いたNode.js開発に、Webpackのビルドをもたらしてくれます。

AWS Lambda は Node.js の4系しかサポートしていないため、一部のES6記法が未だ使えない状況にありますが、serverless webpack を使用すればそのあたりの問題は解決できます。

また、複雑なプロジェクト構成においても、必要なファイルに絞ってファイルをバンドルしてくれるので、無駄にデプロイのサイズが膨らむこともなく、loader などを用いた yamlファイルや、HTMLの組み込みなども行えるので非常に便利です。

Usage

以下のコマンドでインストールしてから、

npm install serverless-webpack --save

serverless.ymlにプラグインを追加します。

plugins:
  - serverless-webpack

Configration

Webpack の設定は webpack.config.jsに記述します。 基本の設定は以下のような形になります。

// webpack.config.js

module.exports = {
  entry: './handler.js',
  target: 'node',
  module: {
    loaders: [ ... ]
  }
};

outputエントリを省略しても、serverless webpack側で自動的に補完されます。

serverless webpack は標準で全てのモジュールをBundleして一つのJSファイルにまとめようとしますが、これを避けたいようなケースでは、externals設定を適用します。

// webpack.config.js
var nodeExternals = require('webpack-node-externals')

modules.export = {
  // we use webpack-node-externals to excludes all node deps.
  // You can manually set the externals too.
  externals: [nodeExternals()],
}

上記のように webpackl-node-externals を利用すると便利ですが、手動で一つづつパッケージ名を記載しても大丈夫です。

externals を設定する場合、これらがパッケージに含まれるよう、serverless.ymlの設定ファイル側でwebpackIncludeModulesを有効にしておきます。

custom:
  webpackIncludeModules: true # enable auto-packing of external modules

webpack

Commands

Webpackのビルド

serverless webpack 

Babel の動作確認などに。.webpackという名前のフォルダにファイルが吐き出されます。

API Gateway のシュミュレーション

serverless webpack serve

完全にシュミレートというわけではなく、レスポンスだったかリクエストだったかの形式が違うとかがあったりますが、概ね使えます。

パスパラメータの付いているHTTPイベントの設定とかも普通に認識する。

たまにエラーで止まったりするので、sls webpackコマンドでエラーを確認する必要があったり。

関数の実行

serverless webpack invoke --function <function-name>

関数を単体で実行します。 --function-f でもOK。

実行はローカルで行われます。

デプロイ

serverless deploy

通常のserverless コマンドの実行で Webpack の Buildが走りデプロイできます。

22
19
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
22
19

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?