zapier / zapier-platform

The SDK for you to build an integration on Zapier

Home Page:https://platform.zapier.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

[Bug]: Build fails for ESM modules

mdesousa opened this issue · comments

Bug Description

We are trying to build a zapier project using "type": "module" in the package.json file. We need this to be able to reference ESM dependencies. The code builds, but when we run zapier push we get the error below:

zapierwrapper.js is treated as an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which declares all .js files in that package scope as ES modules.

Reproduction Steps

  1. Create a new integration with zapier init
  2. Set "type": "module" in the package.json
  3. Run zapier push

Zapier Platform version

15.5.3

Node.js version

18.5.0

Your Operating System

darwin-arm64

npm/yarn version

9.6.7

App ID

No response

More Details

No response

Not sure if this is directly related. But I tried to add axios@1.6.7 as a dependency, and was finding that zapier push is not including all the files properly.
Yet, axios@0.28.0 works find. The main difference that I can see between the 2 versions is that 1.6.7 uses the import/export syntax, whereas 0.28.0 is the old school require function call.
I guess the smart dependency detection is not working with import/export syntax used by the node_modules?

Using import/export in typescript is fine as currently they get transpiled into require calls. But if the packages in node_modules themselves are using import/export, then things seems to be broken.

Any update's on this? I would like to use ESM syntax when developing my zap.

You can use ESM syntax for your own files and code.
It's the node module dependencies that you need to be careful. Some packages seem to think that ESM modules should be universally accepted that they release packages with import/import syntax, which tends to break a few things here and there. And the smart packager that Zapier uses or implements doesn't seem to process this kind of dependencies and would not include some files.

You can use ESM syntax for your own files and code.

To clarify I was looking for native ESM support in the zapier-platform without a build step (example build steps: typescript/babel).

I tried converting my app to ESM and running the latest node (v22.4.1) I get the following error when running zapier validate

@johnemau ➜ /workspaces/zapier-integration (main) $ zapier validate --debug
  zapier:validate argv is [ '--debug' ] +0ms
  zapier:validate args are {} +2ms
  zapier:validate flags are { debug: true, format: 'table' } +1ms
  zapier:validate ------------ +0ms
Validating project locally
  zapier:validate Error [ERR_REQUIRE_ESM]: require() of ES Module /workspaces/zapier-integration/index.js from /usr/local/share/nvm/versions/node/v22.4.1/lib/node_modules/zapier-platform-cli/src/utils/local.js not supported.
  zapier:validate Instead change the require of index.js in /usr/local/share/nvm/versions/node/v22.4.1/lib/node_modules/zapier-platform-cli/src/utils/local.js to a dynamic import() which is available in all CommonJS modules.
  zapier:validate     at TracingChannel.traceSync (node:diagnostics_channel:315:14)
  zapier:validate     at getLocalAppHandler (/usr/local/share/nvm/versions/node/v22.4.1/lib/node_modules/zapier-platform-cli/src/utils/local.js:20:14)
  zapier:validate     at localAppCommand (/usr/local/share/nvm/versions/node/v22.4.1/lib/node_modules/zapier-platform-cli/src/utils/local.js:43:19)
  zapier:validate     at ValidateCommand.perform (/usr/local/share/nvm/versions/node/v22.4.1/lib/node_modules/zapier-platform-cli/src/oclif/commands/validate.js:14:26) +2ms
(node:49707) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
(Use `node --trace-deprecation ...` to show where the warning was created)
  zapier:analytics sending {
  command: 'validate',
  isValidCommand: true,
  numArgs: 0,
  flags: { debug: true, format: 'table' },
  cliVersion: '15.10.0',
  os: 'linux',
  sendUserId: true
} +0ms
 ›   Error: require() of ES Module /workspaces/zapier-integration/index.js from /usr/local/share/nvm/versions/node/v22.4.1/lib/node_modules/zapier-platform-cli/src/utils/local.js not supported.
 ›   Instead change the require of index.js in /usr/local/share/nvm/versions/node/v22.4.1/lib/node_modules/zapier-platform-cli/src/utils/local.js to a dynamic import() which is available in all CommonJS modules.
// index.js
import{ app } from './src/app.js';
export default app;

However, after spending from time looking into ESM and CommonJS interop, I believe the ROI for my request is low since it looks like the zapier platform is written in CommonJS and that would be a lot of code to rewrite into ESM.

I will just stick with keeping my zap in CommonJS, and if I really need ESM features (life from a dependency), use a transpiler (babel/typescript).