From the documentation here, it looks like I should be able to add the following to my jest config extensionsToTreatAsEsm: [".js", ".mjs"],. But when I run I get
Unknown option "extensionsToTreatAsEsm" with value [".js", ".mjs"] was found.
This is probably a typing mistake. Fixing it will remove this message.
I am on latest so what am I missing?
I was getting the same error seems like it's still experimental and my build was failing on GitHub. For the time being I went without the native ESM modules configuration in jest.config.js
extensionsToTreatAsEsm [array < string >]
Jest will run .mjs and .js files with nearest package.json's type field set to module as ECMAScript Modules. If you have any other files that should run with native ESM, you need to specify their file extension here.
Note: Jest's ESM support is still experimental,
I've managed to resolve this by providing
"jest": {
"extensionsToTreatAsEsm": [".ts"]
}
option in the package.json instead of jest.config.ts.
Related
I'm currently rewriting a NodeJS project from a messy combination of CommonJS and Babel-transpiled ES Modules to be completely ES Module based.
In the process, I've become a bit confused by how Node handles these things. I've tried to read up on it, but I seem to be missing one final piece in my understanding.
I was assuming I would no longer need to use Babel to transpile the ES Modules. This seems to be correct. However, when I run my (Jest) tests, I still need to use the --experimental-vm-modules Node flag to make everything work.
My question is: what does that flag do? Reading the documentation, this seems to enable ES Modules, but didn't I already enable ES Modules by specifying "type": "module" in the package.json file?
Relevant links:
https://nodejs.org/api/esm.html#enabling
https://nodejs.org/api/cli.html#--experimental-vm-modules
https://jestjs.io/docs/ecmascript-modules
Specifying type: "module" in package.json just telling library authors your source code is based on ESM.
For jest, you need to use experimental-vm-modules because the node api jest uses to enable ESM support is still not stable as of node 18.x
https://jestjs.io/docs/ecmascript-modules
I've set up a new nodeJS project with typescript. My linter is flagging me with errors, for example:
import authentication from "./routes/authentication"; // Flags "Cannot find module ..."
I would like it to flag a warning/error for these statements, as they break my app when I try to load it:
const pool = require("../database/db"); // Currently not flagging as a warning either for the fact that the file does not exist, or that it is using a require() statement.
I'm guessing eslint is doing my linting. But I haven't explicitly set it up. I tried creating and playing with a .eslint.rc file, but nothing happened.
How do I check what my linter is? I can't find anything in my VS-Code settings to say what I'm using. I can't find any reference to it in my package.json or tsconfig.json files that reference a linter either?
How do I then get my linter to flag require() statements?
So it looks like eslint was already running. It was installed in my extensions, but I've no idea what rules it was using. It must have been some defaults?
I ran yarn add eslint -D and npx eslint --init to set up eslint. Then I changed the rules: object in my .eslintrc.js file. This seems to have changed the linting, which suggests I was already using eslint.
I haven't yet worked out how to flag errors for the require() statements. I've found this YouTube video, which explains that:
require() statements are just functions. We can write require() statements within if() conditions and functions. This is not possible with import ... from ... statements
Because require() statements are functions, they are only being called in runtime. imports are static, so they are being checked by typescript in parse time. This is useful as it means we can get errors before moving into runtime.
I never found a better way of checking what linter my VS-Code was running other than setting up eslint with the github.com/typescript-eslint/... instructions and then playing with the .eslintrc.js file to see that the rules changed. Even then I had to runyarn eslint . --ext .js,.jsx,.ts,.tsx before the rules:{} in my .eslintrc.js started to take effect.
In order to get the require() statements to flag up with my linter, I added the following to my .eslintrc.js rules:{} property:
rules: {
"#typescript-eslint/no-var-requires": 1,
...
}
Although this didn't take effect until after I'd followed the steps described in item 1. As stated above, for some reason I had to run yarn eslint . --ext .js,.jsx,.ts,.tsx before the rules:{} in my .eslintrc.js started to take effect.
I'm trying to set up a node project so I can use the common import/export syntax, and for compatibility, use babeljs to convert the import and export statements to requires.
When I try transpiling using babel though, I'm not seeing any changes and I don't know why.
Here's my babel.config.js
// babel.config.js
module.exports = {
// I thought this was what I would need to add for making the changes, based on the docs
plugins: ["#babel/plugin-transform-modules-commonjs"],
// env takes care of the majority of changes I might need to convert code to make
// easy to run on a wider range of machines
presets: [
[
"#babel/preset-env",
{
targets: {
// target an older version where I know there is no ESM support
node: "10"
}
}
]
],
// this was in the docs too - I'm not sure if I need it TBH
sourceType: "module"
}
I have a bunch of code using import/export, and async/await in a directory, that I wanted to transpile and put into another directory, lib.
Here's the command I am using:
npx babel src --out-dir lib
My package.json file online too, and there's nothing too esoteric there. I've tried to follow the documentation faithfully.
I would expect to see changes in the code to replace the import/export calls with requires in the lib, but no joy.
What am I doing wrong here? I worked on a related project 6-7 months ago, where I am using babel like this and it does make the changes for me.
You can see the branch with the problem code on github, with the package.json, and here's the source code for other project mentioned where it is working.
Please be gentle, fellow SO commenters - I'm trying my best, I really am.
It looks like you're using "babel-cli": "^6.26.0" instead of "#babel/cli": "^7.11.6" that should fix it.
I have a problem with my Angular project build, and ultimately deployment to heroku. I'm using an old(ish) npm package called binary parser, which causes the following error on when I build / deploy to heroku:
Module not found: Error: Can't resolve 'console' in '/tmp/build_e75b87f248f44978f9537d83b3172254/node_modules/binary-parser/dist'
The binary-parser.js has a line require("console"); which is used in exactly one place, so local builds succeed and the application works perfectly, if only I remove console from that line altogether. But as, heroku installs node modules when deploying, this only helps when I manually build the prod version.
I have installed typings for binary-parser and for TS, and also included "types": ["node"] in both tsconfig.json and tsconfig.app.json compilerOptions.
As angular these days doesn't really allow for webpack configuration, I've tried adding global.console = global.console || require('console-browserify');
(or)
global.console = global.console || require('console');
to my polyfills, to no avail.
Any ideas on how to solve this? Do I need to configure a custom webpack to circumvent this? I'll gladly post additional information if necessary!
Here's a possible cause, may or may not be what you or others reading this question are experiencing...
My IDE's auto importing added import * as console from "console"; when I typed console.log.
Solution was of course to remove that import statement.
After trying for multiple hours to come up with the right configuration, the only solution I could come up with was forking the repo in question and changing tsconfig target from es5 to es6, which got rid of the console import altogether upon compilation.
I started seeing:
(node:6420) Warning: require() of ES modules is not supported.
when starting my webpack build and was wondering if using all import export for webpack.config.js was supported yet.
edit 1: I want to know if it's supported without using #babel/register or other transforms
Is is supported in Node 13. You can use either the .mjs extension (for files where you need to use import/export), or set "type": "module" in your package.json.
If your code runs in Node, you can use the fs package to interact with the file system