Unexpected character '#'

[henhal]

This is a Bug

Description

Using serverless-bundle and TS code, after installing p-map from npm, serverless-webpack fails to bundle my code.
It appears a custom loader may be required, or some config to allow private class fields. How can I configure serverless-webpack to support this?

For bug reports:

• What went wrong?

Webpack fails with:

Serverless: Bundling with Webpack...

ERROR in /foo/bar/node_modules/aggregate-error/index.js 7:1
Module parse failed: Unexpected character '#' (7:1)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| 
| export default class AggregateError extends Error {
> 	#errors;
| 
| 	name = 'AggregateError';
 @ /foo/bar/node_modules/p-map/index.js 1:0-45 42:17-31
 @ /foo/bar/src/operations/utils.ts
 @ /foo/bar/src/operations/index.ts
 @ /foo/bar/src/api.ts
 @ /foo/bar/src/index.ts
 
 Error ---------------------------------------------------
 
  Error: Webpack compilation error, see stats above
      at /foo/bar/node_modules/serverless-webpack/lib/compile.js:37:15

• What did you expect should have happened?

Complication success

• What was the config you used?

  bundle:
    sourceMaps: true
    packager: yarn
    linting: true

package.json:

"dependencies": {
  "p-map": "^5.0.0"
}

• What stacktrace or error message from your provider did you see?

Module parse failed: Unexpected character '#' (7:1)

Similar or dependent issue(s):

Additional Data

• Serverless-Webpack Version you're using: 5.50
• Webpack version you're using: 4.46.0
• Serverless Framework Version you're using: 2.41.1
• Operating System: Ubuntu 18.04
• Stack Trace (if available): See above

[henhal]

Related: webpack/webpack#10216
Seems this may be fixed in webpack 5, but serverless-bundle requires webpack 4.

[j0k3r]

Then it's more related to serverless-bundle.
Have you tried using babel loader in webpack?

[henhal]

@j0k3r No, I'm quite new to using custom loaders (which is why I like serverless-bundle's zero-config setup), but I could give it a go.

But yes, I agree this may be more related to serverless-bundle because it seems webpack has fixed this in v5, which can be used together with serverless-webpack, however serverless-bundle must use webpack v4, but does have webpack v5 support recently reaching beta. So I'm hoping this will be resolved once it goes out of beta.

[thomaschaaf]

@henhal can you check if it works with the beta? It's more like a RC right now. We are confident that everything works but changing the webpack version is quite a large change.

[j0k3r]

So can I close it since it's not directly related to serverless-webpack?

[henhal]

@j0k3r Sorry for the delay.
I made a minimal PoC:

import pMap from 'p-map';

export async function hello(event: any) {
  const msg = await pMap(['hello', 'world'], async s => s.toUpperCase());
  return {
    statusCode: 200,
    body: msg
  };
}

With latest stable serverless-bundle (4.3.1), this fails as above. With 5.0.0-beta.2 it packages without issues.
So please go ahead and close this one. Thanks for your support.