I need to develop a npm package like wpcom-xhr-request, this package can be used in node and web, I cloned this package and give it a new name , create a personal git package. it can only work in web, when it is used in node, it give this error:
import requestHandler from 'acme-xhr-request';
^^^^^^
SyntaxError: Unexpected token import
at createScript (vm.js:80:10)
why does wpcom-xhr-request can be used at both environment? how can do this without n8-make? currently , makefile make our work a litter complex , I don't like to introduce new complexity。
I suspect the version of node you're using doesn't understand import yet. It can be enabled via experimental features of node, but you'll need to use the require syntax (not import), or transpile it down to ES5 with a tool like babel for now.
Node.js - SyntaxError: Unexpected token import
Setup webpack for your node app, then install the babel-loader to transpile the ES6 javascript down to ES5.
https://github.com/babel/babel-loader
Related
I'm kind of a newbie with node.js, so please, be merciful :)
I use node ver 14.15.1
The problem I'm facing is to get a npm module("ghost-cursor", https://www.npmjs.com/package/ghost-cursor) that is written in ES6 ("import") working in commonjs (require).
I need to pack my node.js app in an exe file and the npm "pkg" doesn't seem to work with ES6. With nexe I can't get to pack all dependencies in order to work outside of the project folder and on other machines... I have tried to transpile the ES6 module to commonjs with babel:
babel --presets=es2015 ./folder/filename.js > ./folder/filenameCJ.js
but I get the error: SyntaxError: Invalid or unexpected token
I have also tried the solutions posted in:
How to use ES6 modules in CommonJS?
but I can't get it to work.
Are there any other ways, except "nexe" and "pkg" to make an exe file from node.js?
Is it possible to use an ES6 module from npm in commonjs with require? If so, how?
Thanky you for your help and replies.
We are developing a project that uses commonjs. When node-fetch is updated to v3.x, jest complains that:
import fetch, { RequestInfo, RequestInit, Response } from 'node-fetch';
SyntaxError: Cannot use import statement outside a module
npm run build succeeds.
If I use node --experimental-vm-modules node_modules/.bin/jest instead of jest, I get:
Must use import to load ES Module
I did some reading, it appears that we need to migrate our project to be an ESM as well. But it does not appear to be easy.
So the question is: when a dependency becomes pure ESM, how do we handle that in our code?
FYI, our project is: https://gitlab.com/tezgraph/tezgraph
I have just tried to use wasm bindings in a react-native project. But the wasm bindings require access to node modules like fs so I used rn-nodeify as a work-around to get the React Native representation of fs and to be able to use require. That worked fine but I think that the wasm bindings are incompatible with react native, because I get the error Dynamic require defined at line 10; not supported by Metro. The error is talking about the line below:
//line 10
const { TextDecoder, TextEncoder, inspect } = require(String.raw`util`);
The bindings I'm using are from this package #iota/identity-wasm
Steps to reproduce
If you want to reproduce this issue I have created a sample RN Project that throws the error by startup.
git clone https://github.com/JonasHiltl/DigitalIdentityNodeified.git
cd ./DigitalIdentityNodeified
npm install
npx react-native start
npx react-native run-android
I'm interested to know what exactly a dynamic require is and if it's possible to replace the dynamic require with a normal one.
Sadly you cannot use require dynamicly in react-native :/
You will have to make a require for every single thing you will need.
Check out this for example:
Dynamic require not supported in React Native
I'm using WebStorm and a newbie to it. when I use import/export statements, it gives me an error of
Unexpected token import
but if I try with require/module.exports it works fine.
N.B- I've configured language version as ES6 from Languages and Frameworks.
This is not WebStorm but Node.js that fails. While import is a part of ES6, native support for ES6 modules in Node.js is very limited and requires special setup - see https://nodejs.org/api/esm.html#esm_enabling. So, you have to compile your code with Babel first. Usually transpiling is a part of build process (using Gulp, Grunt, WebPack, etc.). Or, you can transpile your code on-the-fly by passing -r babel-register to Node.js. Of course, you need creating appropriate .babelrc and install the required modules (npm install --save-dev babel-cli babel-preset-env)
Steps to reproduce:
npm install -g create-react-app
create-react-app demo-app
cd demo-app
npm install --save instascan
# add `import Instascan from 'instascan'` to index.js
npm start
Error message:
Failed to compile.
Error in ./~/instascan/src/camera.js
Module parse failed: /Users/rd/code/instascan-react/node_modules/instascan/src/camera.js Unexpected token (13:8)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (13:8)
# ./~/instascan/index.js 6:10-33
Error in ./~/instascan/src/scanner.js
Module parse failed: /Users/rd/code/instascan-react/node_modules/instascan/src/scanner.js Unexpected token (208:8)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (208:8)
# ./~/instascan/index.js 5:11-35
Further inspection show that calls to async are found at camera.js:13 and scanner.js:208. The create-react-app docs say that async/await is supported, but maybe this isn't enabled for dependencies?
I'm not sure what to try next. Any guidance here would be much appreciated.
This is working as expected.
Create React App only compiles your code to ES5 (which browsers and the minifier can understand) but not the code of your dependencies. Otherwise it would be much slower (and it also breaks some libraries).
You can file an issue with the library that is shipping uncompiled code, and ask them to compile it to ES5 before publishing to npm. This is generally the recommended practice, and most libraries supporting browser usage do that.