Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/goldwasserexchange/serverless-plugin-webpack
Serverless Plugin Webpack
https://github.com/goldwasserexchange/serverless-plugin-webpack
aws aws-lambda optimization plugin serverless tree-shaking webpack webpack2
Last synced: about 1 month ago
JSON representation
Serverless Plugin Webpack
- Host: GitHub
- URL: https://github.com/goldwasserexchange/serverless-plugin-webpack
- Owner: goldwasserexchange
- License: mit
- Created: 2017-03-09T11:26:10.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2023-02-27T18:29:26.000Z (over 1 year ago)
- Last Synced: 2024-09-28T22:05:09.413Z (about 2 months ago)
- Topics: aws, aws-lambda, optimization, plugin, serverless, tree-shaking, webpack, webpack2
- Language: JavaScript
- Homepage:
- Size: 411 KB
- Stars: 75
- Watchers: 4
- Forks: 14
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# Serverless Plugin Webpack
[](http://www.serverless.com)
[](https://badge.fury.io/js/serverless-plugin-webpack)
[](https://travis-ci.org/goldwasserexchange/serverless-plugin-webpack)
[](https://coveralls.io/github/goldwasserexchange/serverless-plugin-webpack?branch=master)
[](https://www.npmjs.com/package/serverless-plugin-webpack)
[](https://greenkeeper.io/)
A [serverless](http://www.serverless.com) plugin to **automatically** bundle your functions **individually** with [webpack](https://webpack.js.org).
Compared to other webpack/optimization plugins, this plugin has the following features/advantages:
- Zero configuration
- Supports `sls package`, `sls deploy` and `sls deploy function`
- Functions are packaged individually, resulting in Lambda deployment packages (zip) containing only the code needed to run the function (no bloat)
- Uses an *array* of webpack configurations instead of one webpack configuration with multiple entry points, resulting in better tree-shaking because dependencies are isolated (see [Tree shaking](https://github.com/FormidableLabs/formidable-playbook/blob/master/docs/frontend/webpack-tree-shaking.md)).
This plugin is partially based on [Serverless Webpack](https://github.com/elastic-coders/serverless-webpack).
## Install
Using npm:
```
npm install serverless-plugin-webpack --save-dev
```
Add the plugin to your `serverless.yml` file:
```yaml
plugins:
- serverless-plugin-webpack
```
## Package exclude / include
The plugin will add `'**'` as an `exclude` at the service level and each bundled javascript file as an `include` at the function level. Original includes and excludes specified in your `serverless.yml` are preserved.
## Webpack configuration
By default the plugin will look for a `webpack.config.js` in the service root. You can specify a custom config file in your `serverless.yml`:
```yaml
custom:
webpack:
config: ./path/to/config/file.js
series: true # run Webpack in series, useful for large projects. Defaults to false.
```
The `entry` and `output` objects are set by the plugin.
Example of webpack config:
```javascript
module.exports = {
// entry: set by the plugin
// output: set by the plugin
target: 'node',
externals: [
/aws-sdk/, // Available on AWS Lambda
],
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader',
query: {
presets: [
[
'env',
{
target: { node: '6.10' }, // Node version on AWS Lambda
useBuiltIns: true,
modules: false,
loose: true,
},
],
'stage-0',
],
},
},
],
},
};
```
If you want to further optimize the bundle and are using ES6 features, you can use the [UglifyJS Webpack Plugin](https://github.com/webpack-contrib/uglifyjs-webpack-plugin) together with the harmony branch of [UglifyJS 2](https://github.com/mishoo/UglifyJS2#harmony) or the [Babili Webpack Plugin](https://github.com/webpack-contrib/babili-webpack-plugin).