3

What I'm trying to do

I'm trying to use the library videojs-abloop

My nodejs version is v12.18.3

What is the problem

First I installed two libraries as asked from videojs-abloop :

npm install video.js videojs-abloop

Then ran the command

$ node --experimental-modules index.js

Error output

$ node --experimental-modules index.js
(node:31057) ExperimentalWarning: The ESM module loader is experimental.
/my_path/testimport/node_modules/videojs-abloop/videojs-abloop.js:8
export default function (window, videojs) {
^^^^^^

SyntaxError: Unexpected token 'export'

What is my project structure

I two files : index.js and package.json :

index.js

import videojs from 'video.js'
import abLoopPlugin from 'videojs-abloop'

abLoopPlugin(window,videojs);

package.json

{ "type": "module" }

What I have checked

I checked about the ESM imports but Node.js 12 : ESM Imports, but I think it is not related to this problem

yuntres
  • 47
  • 1
  • 1
  • 6
  • Try renaming your file to `index.mjs` – Phil Jul 27 '20 at 05:22
  • @Phil, it does not work – yuntres Jul 27 '20 at 05:48
  • Checkout this one https://stackoverflow.com/questions/45854169/how-can-i-use-an-es6-import-in-node . If you really want to use es6 import/export and all features of es6 and next, try using typescript OR follow this one https://www.freecodecamp.org/news/how-to-enable-es6-and-beyond-syntax-with-node-and-express-68d3e11fe1ab/ – Saroj Jul 27 '20 at 05:52
  • @Phil: That obviously won't change anything, since the error is in a third-party NPM package, not the OP's code, so there is *nothing* the code can change in their code that would have any influence whatsoever. – Jörg W Mittag Jul 27 '20 at 05:55
  • @Saroj: The error is in a third-party NPM package, not in the OP's code. The OP can read tutorials all they want, *nothing* they can change in their own code will fix the problem. – Jörg W Mittag Jul 27 '20 at 05:56
  • @JörgWMittag I am seeing .mjs is experimental feature. Would you recommend this using for production code ? – Saroj Jul 27 '20 at 06:00
  • "The error is in a third-party NPM package" - the error was mine! Should be fixed now in v.1.2.0, see answer below. – phhu Oct 09 '20 at 15:08

2 Answers2

4

It is impossible to tell just from looking at a file whether it is an ECMAScript Script or an ECMAScript Module. Therefore, you need to tell the engine which of the two it is.

On the web, this is solved via different MIME Types, but MIME Types don't exist on filesystems, so Node.js uses the file extension (.mjs) or the type field in package.json ("type": "module") to distinguish between the two.

As the documentation says [Note: I am quoting from the latest docs, but the only difference is whether ESM are enabled by default or not]:

Enabling

Experimental support for ECMAScript modules is enabled by default. Node.js will treat the following as ES modules when passed to node as the initial input, or when referenced by import statements within ES module code:

  • Files ending in .mjs.
  • Files ending in .js when the nearest parent package.json file contains a top-level field "type" with a value of "module".
  • Strings passed in as an argument to --eval, or piped to node via STDIN, with the flag --input-type=module.

There are several pages more about how exactly Node.js determines whether a file is an ECMAScript Script or an ECMAScript Module.

You seem to have an outdated or somehow broken version of videojs-abloop. According to the GitHub Issues, and particularly this commit, videojs-abloop is written as an ECMAScript Module but is transpiled to an ECMAScript Script. In your case, for some reason, you have an ECMAScript Module instead of an ECMAScript Script of videojs-abloop.

Jörg W Mittag
  • 363,080
  • 75
  • 446
  • 653
  • Thank you for the clarification. I understood. For someone who might need to understand the difference between modules and script (like me before reading this) : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules – yuntres Jul 27 '20 at 07:35
  • BTW I have updated version of `videojs-abloop` but still it is a `Module` (It has `export default function ...` as the function definition) – yuntres Jul 27 '20 at 07:37
  • ‍♀️ `"type": "module"` gets me every time! – Metro Smurf Nov 25 '22 at 15:29
0

I've published an update to videojs-abloop (version 1.2.0) which reverts to exporting the plugin using Common JS. This seems to work, either using require to import the modules, or with "type":"module" or --experimental-modules set and import used.

I recreated your issue using your code, then applied the update and the issue went away.

Please update to v1.2.0 and let me know if it works (issues via https://github.com/phhu/videojs-abloop/issues)

Thanks for posting the problem, and sorry for the oversight!

To make the change manually, just change the first line non-comment line of node_modules/videojs-ablooop/videojs-abloop.js to

module.exports = function (window, videojs) {

phhu
  • 1,462
  • 13
  • 33