Is it possible to deactivate this error in eslint?
Parsing error: 'import' and 'export' may only appear at the top level 
- 2This is looking like a won't fix scenario. See github.com/eslint/eslint/issues/2259 and also github.com/eslint/espree/issues/124 ; particularly, the quote from the dev at the end of 124, saying he basically sees no reason to support invalid syntax.Paul– Paul2016-08-26 05:08:19 +00:00Commented Aug 26, 2016 at 5:08
- 2See also:Why must import / export declarations be top level in es2015?Paul– Paul2016-08-26 05:11:00 +00:00Commented Aug 26, 2016 at 5:11
Add a comment |
8 Answers
ESLint natively doesnt support this because this is against the spec. But if you use babel-eslint parser then inside your eslint config file you can do this:
{ "parser": "babel-eslint", "parserOptions": { "sourceType": "module", "allowImportExportEverywhere": true } } Doc ref: https://github.com/babel/babel-eslint#configuration
Support for dynamic import has been added in eslint 6.2.
You need to set ecmaVersion to 11 (or 2020) though.
"parserOptions": { "ecmaVersion": 11 ... } You can test that in their online demo.
4 Comments
Steven Matthews
Would it work like this? "eslintConfig": { "extends": "react-app", "parserOptions": { "ecmaVersion": 11 } },
Roger Heathcote
That alone didn't work for me, I had to add the following line too - "sourceType": "module"
Luizgrs
it does work in the online demo with
sourceType: script
College Code
This is a more update to date answer.
In my case:
Added javascriptreact for a react project. I guess the project type should be added to the plugins.
{ ..., "plugins": [ "prettier", "javascriptreact" ], ... } 
Comments
add this to your eslint file:
env: { browser: true, commonjs: true, module: true, es2021: true, node: true, }, 
1 Comment
Jeremy Caney
Thank you for your interest in contributing to the Stack Overflow community. This question already has quite a few answers—including one that has been extensively validated by the community. Are you certain your approach hasn’t been given previously? If so, it would be useful to explain how your approach is different, under what circumstances your approach might be preferred, and/or why you think the previous answers aren’t sufficient. Can you kindly edit your answer to offer an explanation?
Had similar issue with eslint v9.x.x. Test files were modules (.mjs) and files being tested commonJs (js). Fixed it with an eslint config change.
Error
Running npx eslint in root of project returns this error:
/home/xxx/projects/yyy/src/browser/js/main.mocha.test.mjs 1:1 error Parsing error: 'import' and 'export' may appear only with 'sourceType: module' Original eslint.config.mjs
One piece of config applies to both file types js and mjs:
import globals from "globals"; import pluginJs from "@eslint/js"; export default [ { ...pluginJs.configs.recommended, name: "browser code", files: ["src/browser/**/*.{js,mjs}"], languageOptions: { sourceType: "script", globals: {...globals.browser} } } ]; Updated eslint.config.mjs
The initial config has been duplicated and the file types amended so the former is applied to commonJs files and the latter to module files. In the module config the sourceType is amended to module:
import globals from "globals"; import pluginJs from "@eslint/js"; export default [ { ...pluginJs.configs.recommended, name: "browser code", files: ["src/browser/**/*.js"], languageOptions: { sourceType: "script", globals: {...globals.browser} } }, { ...pluginJs.configs.recommended, name: "browser code module", files: ["src/browser/**/*.mjs"], languageOptions: { sourceType: "module", globals: {...globals.browser} } } ]; After these changes the error no longer flagged.
Comments
At first, let me tell you one thing for the beginners of how can you find out your eslint config file.Here in this blog you will find out detailed explanation of how you can do it.Now come to the ans, most of the answers which has been posted here is very old.The config file format of eslint is ".eslintrc.json" this until eslintv8.21.0 came in Aug 19,2022.Now eslint is using "eslint.config.mjs" this file configuration format.So, for this new file format we can't write code like what has been using for a long time in ".eslintrc.js" this file format. To solve this problem you just need to add one line of code and that is this one.
{ languageOptions: { sourceType: "module" } }, Here is the default "eslint.config.mjs" file code-
import globals from "globals"; import pluginJs from "@eslint/js"; import pluginReact from "eslint-plugin-react"; /** @type {import('eslint').Linter.Config[]} */ export default [ { files: ["**/*.{js,mjs,cjs,jsx}"] }, { files: ["**/*.js"], languageOptions: { sourceType: "commonjs" } }, { languageOptions: { globals: globals.browser } }, pluginJs.configs.recommended, pluginReact.configs.flat.recommended, ]; After adding languageoptions as module, the updated code looks like this-
import globals from "globals"; import pluginJs from "@eslint/js"; import pluginReact from "eslint-plugin-react"; /** @type {import('eslint').Linter.Config[]} */ export default [ { files: ["**/*.{js,mjs,cjs,jsx}"] }, { files: ["**/*.js"], languageOptions: { sourceType: "commonjs" } }, { languageOptions: { sourceType: "module" } }, { languageOptions: { globals: globals.browser } }, pluginJs.configs.recommended, pluginReact.configs.flat.recommended, ];