|
| 1 | +# Migration Guide |
| 2 | + |
| 3 | +This guide covers the following use cases of netlify-lambda and how to accomplish them without this deprecated tool. |
| 4 | + |
| 5 | +- [Run Netlify functions locally](#run-netlify-functions-locally) |
| 6 | +- [Use Typescript or non-standard JavaScript features](#use-typescript-or-non-standard-javascript-features) |
| 7 | +- [Bundle with Webpack](#bundle-with-webpack) |
| 8 | +- [Install function dependencies](#install-function-dependencies) |
| 9 | + |
| 10 | +## Run Netlify Functions locally |
| 11 | + |
| 12 | +The tooling to run functions locally has been completely integrated into the Netlify CLI, which offers even more functionality like local debugging. |
| 13 | + |
| 14 | +If you had `netlify-lambda` in your npm scripts, you can migrate by changing to the Netlify CLI `dev` command. |
| 15 | + |
| 16 | +For example in a theoretical Gatsby project you can migrate with the following changes: |
| 17 | + |
| 18 | +> package.json |
| 19 | +
|
| 20 | +```diff |
| 21 | + { |
| 22 | + "scripts": { |
| 23 | +- "start:app": "npm run develop", |
| 24 | +- "start:lambda": "netlify-lambda serve src/lambda", |
| 25 | +- "start": "concurrently \"yarn start:lambda\" \"yarn develop\"", |
| 26 | +- "develop": "gatsby develop", |
| 27 | ++ "start": "netlify dev", |
| 28 | + }, |
| 29 | + "devDependencies": { |
| 30 | +- "netlify-lambda": "^1.4.3", |
| 31 | ++ "netlify-cli": "^10.14.0", |
| 32 | + } |
| 33 | + } |
| 34 | +``` |
| 35 | + |
| 36 | +## Use TypeScript or non-standard JavaScript features |
| 37 | + |
| 38 | +Netlify now supports TypeScript and non-standard JavaScript features. |
| 39 | +For TypeScript there is no configuration needed and it will work out of the box. The same is true if you use ESM modules in your functions. The bundling logic will automatically detect these and use `esbuild` or `nft` to bundle the functions. |
| 40 | +In any other case you can set the `node_bundler` to `esbuild` yourself for the functions in your `netlify.toml` file. https://docs.netlify.com/configure-builds/file-based-configuration/#functions |
| 41 | + |
| 42 | +Should `esbuild` not work for your use case then please report this to us or use webpack directly as described in the next section. |
| 43 | + |
| 44 | +## Bundle with Webpack |
| 45 | + |
| 46 | +If after trying our [automated bundling](#use-typescript-or-non-standard-javascript-features) you still want to use webpack to bundle your functions, you can use webpack directly and adjust the config to your needs. The following example is for webpack 4, which is the version that netlify-lambda used. |
| 47 | + |
| 48 | +> package.json |
| 49 | +
|
| 50 | +```json |
| 51 | +{ |
| 52 | + "scripts":{ |
| 53 | + "build":"webpack --config ./webpack.config.js" |
| 54 | + } |
| 55 | + "devDependencies": { |
| 56 | + "webpack": "^4.46.0", |
| 57 | + "webpack-cli": "^4.10.0", |
| 58 | + "babel-loader": "^8.2.5", |
| 59 | + "@babel/preset-env": "^7.18.9", |
| 60 | + } |
| 61 | +} |
| 62 | +``` |
| 63 | + |
| 64 | +> webpack.config.js |
| 65 | +
|
| 66 | +```js |
| 67 | +const webpack = require('webpack'); |
| 68 | + |
| 69 | +module.exports = { |
| 70 | + mode: 'production', |
| 71 | + resolve: { |
| 72 | + extensions: ['.wasm', '.mjs', '.js', '.json', '.ts'], |
| 73 | + mainFields: ['module', 'main'], |
| 74 | + }, |
| 75 | + module: { |
| 76 | + rules: [ |
| 77 | + { |
| 78 | + test: /\.(m?js|ts)?$/, |
| 79 | + exclude: new RegExp( |
| 80 | + `(node_modules|bower_components|\\.(test|spec)\\.?)`, |
| 81 | + ), |
| 82 | + use: { |
| 83 | + loader: require.resolve('babel-loader'), |
| 84 | + options: { |
| 85 | + cacheDirectory: true, |
| 86 | + presets: [ |
| 87 | + [ |
| 88 | + require.resolve('@babel/preset-env'), |
| 89 | + { targets: { node: '16.6.0' } }, |
| 90 | + ], |
| 91 | + ], |
| 92 | + }, |
| 93 | + }, |
| 94 | + }, |
| 95 | + ], |
| 96 | + }, |
| 97 | + context: './src/functions', |
| 98 | + entry: {}, |
| 99 | + target: 'node', |
| 100 | + plugins: [new webpack.IgnorePlugin(/vertx/)], |
| 101 | + output: { |
| 102 | + path: './netlify/functions', |
| 103 | + filename: '[name].js', |
| 104 | + libraryTarget: 'commonjs', |
| 105 | + }, |
| 106 | + optimization: { |
| 107 | + nodeEnv: process.env.NODE_ENV || 'production', |
| 108 | + }, |
| 109 | + bail: true, |
| 110 | + devtool: false, |
| 111 | + stats: { |
| 112 | + colors: true, |
| 113 | + }, |
| 114 | +}; |
| 115 | +``` |
| 116 | + |
| 117 | +## Install function dependencies |
| 118 | + |
| 119 | +Consider moving the dependencies of your functions into your main `package.json` for automatic installation during local development. If this is not possible you can use the following change. |
| 120 | + |
| 121 | +Note that this is needed for local development only. The Netlify build system will detect and install dependencies of your functions. |
| 122 | + |
| 123 | +> package.json |
| 124 | +
|
| 125 | +```diff |
| 126 | + { |
| 127 | + "scripts": { |
| 128 | +- "postinstall": "netlify-lambda install", |
| 129 | ++ "postinstall": "npm --prefix ./functions/my-function i && npm --prefix ./functions/other-function i", |
| 130 | + }, |
| 131 | + "devDependencies": { |
| 132 | +- "netlify-lambda": "^1.4.3", |
| 133 | + } |
| 134 | + } |
| 135 | +``` |
0 commit comments