serverless with azure functions and webpack

Question

I'm wondering if there is anyone using serverless framework with azure functions and how you handle sharing code across functions & bundling?

I'm converting hapi.js app to serverless + serverless-azure-functions and I'm trying to bundle my code before deploying so I can use various require for reusable modules.

I found serverless-webpack and It create bundles that probably works on AWS Lambda but there is a problem on azure because of lack of function.json files (ex. list-function.json), so the functions aren't visible at all inside azure-portal nor I can't invoke them.

Also found article about this problem but It shows how to handle this with azure-functions-cli which only support Windows platform.

Best, JH

Gary Liu Gary Liu · Accepted Answer · 2017-09-12T07:52:53

Giting hints from https://medium.com/a-man-with-no-server/deploying-a-serverless-application-using-webpack-and-babel-to-support-es2015-to-aws-2f61cff8bafb, I modified a serverless azure functions start-up test project with serverless-webpack, which seems to be satified with your requirement.

I built a src folder in the root directory of serverless azure functions project, as the develop source code folder. With 2 test files:
handler.js

'use strict';
let tool = require("./tool");
/* eslint-disable no-param-reassign */

module.exports.hello = function (context) {
  context.log('JavaScript HTTP trigger function processed a request.');

  context.res = {
    // status: 200, /* Defaults to 200 */
    body: tool.hello(),
  };

  context.done();
};

tool.js

module.exports={
    hello:()=>{
        return "hello world";
    }
}

webpack.config.js in root directory:

var nodeExternals = require('webpack-node-externals')

module.exports = {
   entry: './src/handler.js',
   target: 'node',
   externals: [nodeExternals()],
   output: {
      libraryTarget: 'commonjs',
      path: __dirname,
      filename: 'handler.js', // this should match the first part of function handler in serverless.yml
   },
   module: {
      loaders: [
         {
            test: /\.jsx?$/,
            exclude: /node_modules/,
            include: __dirname,
            loaders: ["babel-loader"]
         }
      ]
   }
};

With which configuration file, the out bundled file will be located in service/handler.js in root directory.

So I modified serverless.yml as well, now it partly looks like:

package:
  include:
    - service/handler.js
  exclude:
    - handler.js

functions:
  hello:
    handler: service/handler.hello
    events:
      - http: true
        x-azure-settings:
          authLevel : anonymous
      - http: true
        x-azure-settings:
          direction: out
          name: res

custom:
  webpackIncludeModules:
    packagePath: './package.json'

After these modified, use serverless deploy will bundle the files in src folder then package and deploy to azure function.

Hope it helps.

serverless with azure functions and webpack

1 Answers