Error trying to import ESM Temporal polyfill in a CJS environment #29
Comments
|
I think you should be able to import the packaged version produced by rollup using CJS though? The source files are ESM indeed but we can investigate a way to use CJS in development... |
|
Actually, I think this should already work, thanks to https://github.com/js-temporal/temporal-polyfill/blob/main/package.json#L6-L8 ? |
|
I agree that it should work, but it doesn't. If I remove I'm not sure if the problem is my webpack config, the serverless-offline package, or some inherent limitation of some environments like AWS Lambda. |
|
May be related to tc39/proposal-temporal#1499 ? |
|
Justin, do you have a minimal repro for this harness/environment I can clone? I'm migrating JSBI to TS and trying to avoid similar issues, so getting to the bottom of this sooner rather than later would be great. |
|
I think I found a fix for this - see the referenced PR. @justingrant can you confirm that your local environment is approximately similiar to this repro I put together? https://github.com/12wrigja/temporal-timeserver-lambda I'm not sure how webpack comes into play here (though I did see it referenced on the serverless-offline README, I just didn't end up using it.) |
Nope. Your repro is traditional CJS code that uses
Below are simplified versions of all the files that should be needed to repro: Here's a simplified version of my webpack.config.js: const slsw = require('serverless-webpack');
const nodeExternals = require('webpack-node-externals');
const path = require('path');
module.exports = {
entry: slsw.lib.entries,
target: 'node',
devtool: 'source-map',
externals: [nodeExternals()],
mode: slsw.lib.webpack.isLocal ? 'development' : 'production',
optimization: { minimize: false },
performance: { hints: false } // Turn off size warnings for entry points
module: {
rules: [
{
test: /\.[jt]s$/,
loader: 'babel-loader',
include: [__dirname, path.resolve(__dirname, '../web/src')], // shared code lives in "../web"
exclude: [/node_modules/],
options: {
// This is a feature of `babel-loader` for webpack (not Babel itself).
// It enables caching results in ./node_modules/.cache/babel-loader/
// directory for faster rebuilds.
cacheDirectory: true,
},
},
{
enforce: 'pre',
exclude: /@babel(?:\/|\\{1,2})runtime/,
test: /\.(js|mjs|jsx|ts|tsx|css)$/,
use: 'source-map-loader',
},
],
},
output:
{
libraryTarget: 'commonjs',
path: path.resolve(__dirname, '.webpack'), // temp folder to hold build output
filename: '[name].js',
devtoolModuleFilenameTemplate: (info) => { // for sourcemap resolution
return path.resolve(info.absoluteResourcePath).replace(/\\/g, '/');
},
},My tsconfig.json is this: And here's a simplified version of my package.json. Note there's no {
"name": "h3-api",
"version": "1.1.0",
"description": "_REDACTED_",
"main": "handler.js",
"scripts": {
"start": "npm run lint && serverless offline start --noTimeout --httpsProtocol .serverlessoffline",
"debug": "export SLS_DEBUG=* && node --inspect /usr/local/lib/node_modules/serverless/lib/Serverless.js offline start",
"webpack": "webpack",
"tsc": "tsc",
},
"author": "",
"license": "MIT",
"repository": {
"type": "git",
"url": "https://github.com/_REDACTED_.git"
},
"devDependencies": {
"@babel/core": "^7.15.0",
"@babel/plugin-proposal-class-properties": "^7.14.5",
"@babel/plugin-proposal-object-rest-spread": "^7.14.7",
"@babel/plugin-transform-runtime": "^7.15.0",
"@babel/preset-env": "^7.15.0",
"@babel/preset-stage-3": "^7.8.3",
"@babel/preset-typescript": "^7.15.0",
"@types/aws-lambda": "^8.10.82",
"@types/mongodb": "^4.0.6",
"@types/node": "^16.6.1",
"@typescript-eslint/eslint-plugin": "^4.29.2",
"@typescript-eslint/parser": "^4.29.2",
"aws-sdk": "^2.971.0",
"babel-loader": "^8.2.2",
"babel-plugin-module-resolver": "^4.1.0",
"babel-plugin-source-map-support": "^2.1.3",
"prettier": "^2.3.2",
"serverless": "^2.55.0",
"serverless-dynamodb-local": "^0.2.40",
"serverless-offline": "^8.0.0",
"serverless-webpack": "^5.5.1",
"source-map-loader": "^3.0.0",
"typescript": "^4.3.5",
"webpack": "^5.50.0",
"webpack-cli": "^4.8.0",
"webpack-node-externals": "^3.0.0"
},
"dependencies": {
"@babel/runtime": "^7.15.3",
// a fork of the polyfill that removes type=module
"@js-temporal/polyfill": "file:../../temporal-polyfill/js-temporal-polyfill-0.2.0.tgz",
"@types/serverless": "^1.78.34",
"node-fetch": "^2.6.1",
"source-map-support": "^0.5.19",
},
}Here's my babel.config.json. {
"presets": ["@babel/typescript", ["@babel/preset-env", { "targets": { "node": "12" } }]],
"plugins": [
[
"module-resolver",
{
"cwd": "packagejson",
"root": ["./"],
"alias": { "@hshared": "./../web/src" }
}
],
"source-map-support",
"@babel/plugin-transform-runtime",
"@babel/proposal-class-properties",
"@babel/proposal-object-rest-spread"
]
}Finally, here's a simplified version of my serverless.yml config: If you change your handler file to getUser.ts, you may be able to use the files above to repro the issue. If not, just let me know and I can fork my project and just keep removing stuff until I end up with a minimal repro. |
|
I think based on comments left on #38 this should now be fixed? Please re-open if not. |
This polyfill is marked as ESM in package..json via
type: 'module', but this is causing an error at runtime in my code which runs in an AWS Lambda function. According to this Stack Overflow answer, AWS Lambda's Node 14 runtime does not support ESM at the moment (or at least didn't as of a few months ago).It's possible (I haven't tested) that the workaround is what's described in dherault/serverless-offline#1014 (comment) might help:
Below is the error I'm seeing at runtime when my code is run locally using the serverless-offline package, which is a harness for running AWS Lambda functions locally on my dev machine. This harness doesn't apparently support ESM either, per dherault/serverless-offline#1014.
If any experts in Node's ESM support, Webpack 5, and/or AWS Lambda have any suggestions, I'm all ears!
The text was updated successfully, but these errors were encountered: