javascript - "Parsing error: Unexpected token import" when accessing import.meta.url (Cloud9 IDE) - Stack Over

admin管理员组

文章数量:1026989

With the following node.js code:

import { fileURLToPath } from 'node:url';
import path from 'node:path';
const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(fileURLToPath(import.meta.url));

I am seeing the following lint error relating to the import.meta.url reference:

This snippet is to replicate __filename and __dirname in ESM as per node.js guidance. The same error is given when using import.meta.url as follows... which is also in the official guidance:

import { readFileSync } from 'fs';
const buffer = readFileSync(new URL('./data.proto', import.meta.url));

I have looked at this but it doesn't solve my problem. This is specifically within the Cloud9 IDE... not the current AWS Cloud9 but a self-hosted Cloud9 based on this repo (last updated 4 years ago). The only guidance from (AWS) Cloud9 is on this page:

I can get certain basic rules to work using this .eslintrc file, e.g.

{
  rules: {
    semi: ["error", "never"]
  }
}

So I know that the config file is taking effect in the IDE. But can't see the appropriate rule to disable the "unexpected token import" error.

EDIT: the following seem relevant but I cannot determine if it has ever really reached a conclusion:

With the following node.js code:

import { fileURLToPath } from 'node:url';
import path from 'node:path';
const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(fileURLToPath(import.meta.url));

I am seeing the following lint error relating to the import.meta.url reference:

This snippet is to replicate __filename and __dirname in ESM as per node.js guidance. The same error is given when using import.meta.url as follows... which is also in the official guidance:

import { readFileSync } from 'fs';
const buffer = readFileSync(new URL('./data.proto', import.meta.url));

I have looked at this but it doesn't solve my problem. This is specifically within the Cloud9 IDE... not the current AWS Cloud9 but a self-hosted Cloud9 based on this repo (last updated 4 years ago). The only guidance from (AWS) Cloud9 is on this page:

I can get certain basic rules to work using this .eslintrc file, e.g.

{
  rules: {
    semi: ["error", "never"]
  }
}

So I know that the config file is taking effect in the IDE. But can't see the appropriate rule to disable the "unexpected token import" error.

EDIT: the following seem relevant but I cannot determine if it has ever really reached a conclusion:

https://github./eslint/eslint/issues/12518

https://github./eslint/eslint/pull/13196

https://github./eslint/eslint/issues/13133

• javascript
• eslint
• lint
• eslintrc
• aws-cloud9

Share Improve this question Follow edited Nov 17, 2021 at 21:36 drmrbrewer asked Nov 17, 2021 at 18:04 drmrbrewerdrmrbrewer 13.2k2424 gold badges9898 silver badges212212 bronze badges 0

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

This is actually an educated guess, since I'm not using the Cloud9 IDE. If your .eslintrc file is being recognized, what you need to add there are the proper parser options, e.g.:

{
  "parserOptions": {
    "ecmaVersion": 2020,
    "sourceType": "module"
  },
  "rules": {
    "semi": ["error", "never"]
  }
}

The reason is that the ESLint parser treats by default all JavaScript sources as ES5 scripts, while the import.meta syntax is only allowed in modules since ECMAScript 2020.

Update

The setting "ecmaVersion": 2020 is supported in ESLint 6 onwards. Another option to have import.meta recognized is using a custom parser like Babel. The packages to install for the Babel parser are @babel/core and @babel/eslint-parser. And the relevant settings in .eslintrc are here:

{
  "parser": "@babel/eslint-parser",
  "parserOptions": {
    "ecmaVersion": 2020,
    "requireConfigFile": false
},

Note: I couldn't find out which versions of ESLint are supported by the Babel parser in the documentation in their repo (link above). I can only see in the code that ESLint 7 and 8 are supported. If the current version of Babel does not work with your version of ESLint, you may have to try installing older releases and see if they work. And in that case, an additional plugin like syntax-import-meta may be required.

With the following node.js code:

import { fileURLToPath } from 'node:url';
import path from 'node:path';
const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(fileURLToPath(import.meta.url));

I am seeing the following lint error relating to the import.meta.url reference:

This snippet is to replicate __filename and __dirname in ESM as per node.js guidance. The same error is given when using import.meta.url as follows... which is also in the official guidance:

import { readFileSync } from 'fs';
const buffer = readFileSync(new URL('./data.proto', import.meta.url));

I have looked at this but it doesn't solve my problem. This is specifically within the Cloud9 IDE... not the current AWS Cloud9 but a self-hosted Cloud9 based on this repo (last updated 4 years ago). The only guidance from (AWS) Cloud9 is on this page:

I can get certain basic rules to work using this .eslintrc file, e.g.

{
  rules: {
    semi: ["error", "never"]
  }
}

So I know that the config file is taking effect in the IDE. But can't see the appropriate rule to disable the "unexpected token import" error.

EDIT: the following seem relevant but I cannot determine if it has ever really reached a conclusion:

With the following node.js code:

import { fileURLToPath } from 'node:url';
import path from 'node:path';
const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(fileURLToPath(import.meta.url));

I am seeing the following lint error relating to the import.meta.url reference:

This snippet is to replicate __filename and __dirname in ESM as per node.js guidance. The same error is given when using import.meta.url as follows... which is also in the official guidance:

import { readFileSync } from 'fs';
const buffer = readFileSync(new URL('./data.proto', import.meta.url));

I have looked at this but it doesn't solve my problem. This is specifically within the Cloud9 IDE... not the current AWS Cloud9 but a self-hosted Cloud9 based on this repo (last updated 4 years ago). The only guidance from (AWS) Cloud9 is on this page:

I can get certain basic rules to work using this .eslintrc file, e.g.

{
  rules: {
    semi: ["error", "never"]
  }
}

So I know that the config file is taking effect in the IDE. But can't see the appropriate rule to disable the "unexpected token import" error.

EDIT: the following seem relevant but I cannot determine if it has ever really reached a conclusion:

https://github./eslint/eslint/issues/12518

https://github./eslint/eslint/pull/13196

https://github./eslint/eslint/issues/13133

• javascript
• eslint
• lint
• eslintrc
• aws-cloud9

Share Improve this question Follow edited Nov 17, 2021 at 21:36 drmrbrewer asked Nov 17, 2021 at 18:04 drmrbrewerdrmrbrewer 13.2k2424 gold badges9898 silver badges212212 bronze badges 0

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

This is actually an educated guess, since I'm not using the Cloud9 IDE. If your .eslintrc file is being recognized, what you need to add there are the proper parser options, e.g.:

{
  "parserOptions": {
    "ecmaVersion": 2020,
    "sourceType": "module"
  },
  "rules": {
    "semi": ["error", "never"]
  }
}

The reason is that the ESLint parser treats by default all JavaScript sources as ES5 scripts, while the import.meta syntax is only allowed in modules since ECMAScript 2020.

Update

The setting "ecmaVersion": 2020 is supported in ESLint 6 onwards. Another option to have import.meta recognized is using a custom parser like Babel. The packages to install for the Babel parser are @babel/core and @babel/eslint-parser. And the relevant settings in .eslintrc are here:

{
  "parser": "@babel/eslint-parser",
  "parserOptions": {
    "ecmaVersion": 2020,
    "requireConfigFile": false
},

Note: I couldn't find out which versions of ESLint are supported by the Babel parser in the documentation in their repo (link above). I can only see in the code that ESLint 7 and 8 are supported. If the current version of Babel does not work with your version of ESLint, you may have to try installing older releases and see if they work. And in that case, an additional plugin like syntax-import-meta may be required.

本文标签：