Typescript v5.0 Support

[jonioni]

It would be great to upgrade related dependencies for Typescript v5.

Current packages:

serverless-bundle/package.json

Line 76 in e1ae01a

"typescript": "^4.5.5",

serverless-bundle/package.json

Lines 41 to 42 in e1ae01a

	"@typescript-eslint/eslint-plugin": "^4.33.0",
	"@typescript-eslint/parser": "^4.33.0",

[Jackman3005]

We are unable to make use of newer typescript features because of this. Although our package.json specifies a newer version of typescript and our code compiles with tsc, we are unable to package using serverless-bundle because it uses the version it specifies... What's the deal with that?

[fabiosenracorrea]

Anyone got a solution on this? Been wanting to update to the newest version

[Jackman3005]

@fabiosenracorrea Unfortunately I was forced to switch away from serverless-bundle in favor of serverless-webpack. It did require a bit of configuration, but I'm happy that serverless-bundle no longer has a say in my Typescript version. Which never really made sense anyways...

I actually tried and gave up on doing this work some time ago because I found it really challenging to figure out what I needed in the webpack configuration. It would've been awesome if serverless-bundle had an "eject" functionality, which seems reasonable and consistent with other full-service opinionated frameworks/starter-kits.

What I did instead

Here's some of what I came up with below, hopefully it helps others that are on this path.

Snippets of my `serverless.yml` and `webpack.config.js`

Context

We have 6 lambdas that are created out of a single codebase. We are using Prisma as our database ORM, which requires copying some platform specific engine files (shown in webpack config). I'm not saying the config I came up with is the best in anyway and am open to feedback. But we are successfully using it in production.

Snippets from serverless.yml

plugins:
  - serverless-webpack
  - serverless-sentry
  - serverless-offline-dotenv
  - serverless-offline
  - serverless-domain-manager
  - serverless-prune-plugin

package:
  individually: true

custom:
  webpack:
    concurrency: 2 # default limit results in out of memory
    webpackConfig: "webpack.config.cjs"
    excludeRegex: \.ts|test|\.txt|\.md
    keepOutputDirectory: true
    packager: yarn

webpack.config.cjs

const webpack = require("webpack");
const slsw = require("serverless-webpack");
const TsconfigPathsPlugin = require("tsconfig-paths-webpack-plugin");
const CopyPlugin = require("copy-webpack-plugin");

module.exports = (async () => {
  const accountId = await slsw.lib.serverless.providers.aws.getAccountId();
  return {
    mode: "production",
    entry: slsw.lib.entries,
    devtool: "source-map",
    plugins: [
      new webpack.DefinePlugin({
        AWS_ACCOUNT_ID: `${accountId}`,
      }),
      new CopyPlugin({
        patterns: [
          {
            from: "node_modules/.prisma/client/*",
            globOptions: {
              ignore: ["**/libquery_engine-*"],
            },
          },
          "node_modules/.prisma/client/libquery_engine-rhel-*",
          "src/assets/**",
        ],
      }),
    ],
    module: {
      rules: [
        {
          test: /\.[jt]sx?$/,
          loader: "esbuild-loader",
          options: { target: "node18", format: "cjs" },
        },
      ],
    },
    resolve: {
      extensions: [".ts", ".ts", ".js"],
      plugins: [new TsconfigPathsPlugin({ extensions: [".ts", ".ts", ".js"] })],
    },
  };
})();

Snippets from package.json devDependencies

Note: This is not all of my dependencies, I just grabbed some that I think are relevant, but I would avoid copying/pasting these and just use them as reference for what versions worked for me with the configuration I provided above.

{
  "devDependencies": {
    "copy-webpack-plugin": "^12.0.2",
    "esbuild": "^0.15.7",
    "esbuild-loader": "^4.0.3",
    "esbuild-node-externals": "^1.5.0",
    "serverless": "^3.34.0",
    "serverless-domain-manager": "^6.1.0",
    "serverless-esbuild": "^1.32.8",
    "serverless-offline": "^10.0.2",
    "serverless-offline-dotenv": "^0.4.1",
    "serverless-plugin-tree-shake": "^1.1.11",
    "serverless-plugin-typescript": "1.1.7",
    "serverless-prune-plugin": "^2.0.1",
    "serverless-sentry": "2.5.2",
    "serverless-webpack": "^5.13.0",
    "tsconfig-paths": "^4.2.0",
    "tsconfig-paths-webpack-plugin": "^4.1.0",
    "typescript": "5.1.5"
  }
}  

[fabiosenracorrea]

@Jackman3005 awesome!! Thanks, I will def give it a try. Sucks that such a nice tool is probably out of my projects due to this TS version lock. I haven't been able to explore options as time is a constraint but i guess I will have to find a way, it's getting out of hand

[Jackman3005]

@fabiosenracorrea Yeah I totally agree. I really don't want to spend any time thinking about these things and I just want it all to work.

I respect the challenge serverless-bundle has in trying to make different setups (i.e. different TS versions in this case) all work well while avoiding as much configuration as possible, but that is the intended scope of the library as I understand it. In this case it currently falls short.

[volo-maslow]

Maybe someone will face this issue too - versions can be overriden using npm 8 like

{
    // ... package.json stuff
    "overrides": {
        "serverless-bundle": {
          "ts-loader": "^9.5",
          "typescript": "^5.7"
        }
      }
}