We Keep Coding

remark-cli "Cannot use import statement outside a module"

I'm creating a documentation project which I npm init'd. This is the relevant part of my package.json
"scripts": {
"lint": "remark --quiet --frail ."
},
"type": "module",
"dependencies": {
"remark-cli": "^10.0.0",
"remark-preset-lint-markdown-style-guide": "^5.0.0"
},
I would now like to lint the Markdown files with remark-cli:
`remark --quiet --frail .`
This is the error I'm getting:
<...>/node_modules/remark-cli/cli.js:2
import {createRequire} from 'node:module'
^^^^^^
SyntaxError: Cannot use import statement outside a module
at Module._compile (internal/modules/cjs/loader.js:895:18)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:995:10)
at Module.load (internal/modules/cjs/loader.js:815:32)
at Function.Module._load (internal/modules/cjs/loader.js:727:14)
at Function.Module.runMain (internal/modules/cjs/loader.js:1047:10)
at internal/main/run_main_module.js:17:11
I thought adding "type": "module" to package.json would solve this but no luck.
What am I doing wrong here?

Error: Cannot find module 'react-dom/test-utils'

Anyone have any idea why as soon as I import this library in my test helper file like so:
import jsdom from "jsdom";
import jquery from "jquery";
import ReactTestUtils from "react-dom/test-utils";
I immediately get the error:
Error: Cannot find module 'react-dom/test-utils' Require stack:
/Users/luiscortes/Projects/auth/client/test/test_helper.js
/Users/luiscortes/Projects/auth/client/test/components/app_test.js
/Users/luiscortes/Projects/auth/client/node_modules/mocha/lib/mocha.js
/Users/luiscortes/Projects/auth/client/node_modules/mocha/index.js
/Users/luiscortes/Projects/auth/client/node_modules/mocha/bin/_mocha
at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
at Function.Module._load (node:internal/modules/cjs/loader:778:27)
at Module.require (node:internal/modules/cjs/loader:1005:19)
at require (node:internal/modules/cjs/helpers:102:18)
at Object. (/Users/luiscortes/Projects/auth/client/test/test_helper.js:3:1)
at Module._compile (node:internal/modules/cjs/loader:1101:14)
at loader (/Users/luiscortes/Projects/auth/client/node_modules/babel-register/lib/node.js:144:5)
at Object.require.extensions. [as .js] (/Users/luiscortes/Projects/auth/client/node_modules/babel-register/lib/node.js:154:7)
at Module.load (node:internal/modules/cjs/loader:981:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Module.require (node:internal/modules/cjs/loader:1005:19)
at require (node:internal/modules/cjs/helpers:102:18)
at Object. (/Users/luiscortes/Projects/auth/client/test/components/app_test.js:1:1)
I am importing just as it says in: https://reactjs.org/docs/test-utils.html#renderintodocument
This is a legacy React application. Could this be a problem with my version of Mocha?
This my package.json file:
"devDependencies": {
"babel-core": "^6.2.1",
"babel-loader": "^6.2.0",
"babel-preset-es2015": "^6.1.18",
"babel-preset-react": "^6.1.18",
"webpack": "^1.12.9",
"webpack-dev-server": "^1.14.0"
},
"dependencies": {
"axios": "^0.20.0-0",
"babel-preset-stage-1": "^6.1.18",
"chai": "^3.5.0",
"jquery": "^2.2.4",
"jsdom": "^8.5.0",
"lodash": "^3.10.1",
"mocha": "^2.3.4",
"react": "^0.14.3",
"react-dom": "^0.14.3",
"react-redux": "^4.0.0",
"react-router": "^2.0.1",
"redux": "^3.0.4",
"redux-form": "^4.2.2",
"redux-thunk": "^1.0.0"
}
}
I have tried rm -rf node_modules && rm package-lock.json a dozen times already, the error will not go away.

For anyone working with React 0.14.3 legacy and you are getting this issue, there seems to be no way around it, you need to upgrade to at least react 15.0.1

how to require constants which is exported in ES6 module?

The original variables are exported in ES6 module like this:
export const url = 'https://example.com/api'
I know I can use this variable using
import {url} from 'src/api'
But the thing is I can't use import in gatsby-config.js file and only can use ES5 syntax.
I tried like this:
const {url} = require('src/api')
but it doesn't work and get errors while gatsby develop
The error is following:
export const url = 'https://example.com/api'
^^^^^^
SyntaxError: Unexpected token 'export'
- v8-compile-cache.js:226 NativeCompileCache._moduleCompile
[project]/[v8-compile-cache]/v8-compile-cache.js:226:18
- v8-compile-cache.js:172 Module._compile
[project]/[v8-compile-cache]/v8-compile-cache.js:172:36
- loader.js:995 Object.Module._extensions..js
internal/modules/cjs/loader.js:995:10
- loader.js:815 Module.load
internal/modules/cjs/loader.js:815:32
- loader.js:727 Function.Module._load
internal/modules/cjs/loader.js:727:14
- loader.js:852 Module.require
internal/modules/cjs/loader.js:852:19
- v8-compile-cache.js:159 require
[project]/[v8-compile-cache]/v8-compile-cache.js:159:20
- gatsby-config.js:4 Object.<anonymous>
C:/project/gatsby-config.js:4:26
- v8-compile-cache.js:178 Module._compile
[project]/[v8-compile-cache]/v8-compile-cache.js:178:30
- loader.js:995 Object.Module._extensions..js
internal/modules/cjs/loader.js:995:10
- loader.js:815 Module.load
internal/modules/cjs/loader.js:815:32
- loader.js:727 Function.Module._load
internal/modules/cjs/loader.js:727:14
- loader.js:852 Module.require
internal/modules/cjs/loader.js:852:19
- v8-compile-cache.js:159 require
[project]/[v8-compile-cache]/v8-compile-cache.js:159:20
- get-config-file.js:33 getConfigFile
[project]/[gatsby]/dist/bootstrap/get-config-file.js:33:20

When you exporting your constant if you use module.exports it should not give this error. Do it like this:
const yourUrl = 'https://example.com/api'
module.exports = { url: yourUrl }

Hope you know what you are trying to achieve because the result produces anti pattern against gatsbyjs specification as it already converts code internally from es6 to es5 after reading and validating gatsby-config.js.
So, try this way to require constants in gatsby-config.js which were exported in es6 module
From es6 to es5 conversion, install #babel/cli and #babel/core package i.e npm install #babel/cli #babel/core --save-dev
Add new npm/yarn script in package.json -> scripts -> "prepare_config" : "NODE_ENV=test babel ./gatsby-config.js <LIST_OF_FILES_TO_CONVERT> --out-dir ./"
Make sure babel-preset-gatsby directory is present under node_modules if not then install it i.e. npm install babel-preset-gatsby --save-dev
Either add .babelrc in project root directory having below code for babel preset and conversion.
{
"presets": [
[
"babel-preset-gatsby",
{
"forceAllTransforms": true,
"useBuiltIns": "usage"
}
]
]
}
OR if you don't want to add .babelrc then specify babel configuration in package.json.
"babel": {
"presets": [
[
"babel-preset-gatsby",
{
"forceAllTransforms": true,
"useBuiltIns": "usage"
}
]
]
}
Now run npm run prepare_config script first for conversion which will import required constants which were exported in ES6 module.
Then you can run gatsby develop successfully.

Change the type:"module" or set in package.json.
{
"name": "server",
"version": "1.0.0",
"type": "module",
"description": "",
"main": "server.js",
"scripts": {
"test": "echo "Error: notestspecified" && exit 1",
"start": "nodemon server.js"
},
"keywords": [
],
"author": "",
"license": "ISC",
"dependencies": {
"#babel/core": "^7.16.5",
"body-parser": "^1.19.1",
"cors": "^2.8.5",
"dotenv": "^10.0.0",
"express": "^4.17.2",
"mongoose": "^6.1.3",
"nodemon": "^2.0.15"
}
}

webpack and babel configuration for normal javascript project is failing

I'm doing this simple setup with webpack and Babel for simple javascript project. I've tried so many examples but nothing is working.
These are my settings :
{
"name": "webpack_babel-prac",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "webpack --config webpack.config.js"
},
"author": "",
"license": "ISC",
"devDependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^8.0.4",
"babel-preset-env": "^1.7.0",
"webpack": "^4.27.1",
"webpack-cli": "^3.1.2",
"webpack-dev-server": "^3.1.10"
}
}
CONFIGURATION FILE
const path = require('path');
module.exports={
entry:{
app:'./src/app.js'
},
output:{
path:path.resolve(__dirname,'build'),
filename:'bundle.js'
},
mode:'development',
module:{
rules:[{
test:/\.js?$/,
exclude:/node_modules/,
loader:'babel-loader',
options:{
presets:['babel-preset-env ']
}
}]
}
}
I'm getting this error while i'm running the npm run build command:
ERROR in ./src/app.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Cannot find module '#babel/core'
babel-loader#8 requires Babel 7.x (the package '#babel/core'). If you'd
like
to use Babel 6.x ('babel-core'), you should install 'babel-loader#7'.
at Function.Module._resolveFilename (module.js:548:15)
at Function.Module._load (module.js:475:25)
at Module.require (module.js:597:17)
at require (C:\Users\ABCD\Music\Webpack_Babel prac\node_modules\v8-compile-
cache\v8-compile-cache.js:159:20)
at Object.<anonymous> (C:\Users\ABCD\Music\Webpack_Babel
prac\node_modules\babel-loader\lib\index.js:10:11)
at Module._compile (C:\Users\ABCD\Music\Webpack_Babel prac\node_modules\v8-
compile-cache\v8-compile-cache.js:178:30)
at Object.Module._extensions..js (module.js:664:10)
at Module.load (module.js:566:32)
at tryModuleLoad (module.js:506:12)
at Function.Module._load (module.js:498:3)
at Module.require (module.js:597:17)
I've gone through so many tutorials and also tried this medium article but nothing is working. https://medium.com/#jeffrey.allen.lewis/the-ultimate-2018-webpack-4-and-babel-setup-guide-npm-yarn-dependencies-compared-entry-points-866b577da6a

Unexpected token in jsdom when used with babel and npx

I want to do some tests on canvas purely in node.js.
This is my package.json
{
"name": "test",
"description": "Test",
"version": "0.1.0",
"author": "anthony#work",
"dependencies": {
"canvas": "^1.6.7",
},
"devDependencies": {
"babel-cli": "^6.26.0",
"babel-preset-env": "^1.6.1",
"babel-preset-stage-0": "^6.24.1",
"jsdom": "^11.3.0"
}
}
This is my .babelrc
{
"presets": ["env", "stage-0"]
}
This is my test javascript (a.js)
const { jsdom } = require('jsdom');
// main
jsdom();
console.log('done')
When I run the script, however,
npx babel a.js | nodejs -- -
I get this error:
/work/node_modules/jsdom/lib/api.js:10
const { URL } = require("whatwg-url");
^
SyntaxError: Unexpected token {
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:374:25)
at Object.Module._extensions..js (module.js:417:10)
at Module.load (module.js:344:32)
at Function.Module._load (module.js:301:12)
at Module.require (module.js:354:17)
at require (internal/module.js:12:17)
at [stdin]:3:16
at Object.exports.runInThisContext (vm.js:54:17)
at Object.<anonymous> ([stdin]-wrapper:6:22)
What causes this error? How can I fix this error?
Version information:
Node.js: v4.2.6
OS: Ubuntu 16.04

You are running an incompatible node version with jsdom.
jsdom#10 requires nodejs v6. So either upgrade Node or downgrade jsdom.
Found info about that here: https://github.com/tmpvar/jsdom#jsdom