（节点：9374）警告：要加载 ES 模块，请设置“type”：“module”

Question

我今天刚开始学习 React。如何在 Visual Studio 的终端中的控制台上消除该错误消息。

(node: 9374)Warning: To load an ES module,
 set "type": "module" in the package.json or use the .mjs extension. 
/Users/nishihaider/workspace-ui/react-todo-app/src/App.js:1

import React from "react";
import "./App.css";

function App() {
  <>
  return (
  <h1>ToDo</h1>
  );
  </>
}

export default App;

Answer 1

首先，安装最新版本的 Node.js。它具有最新和最强大的功能。

其次，"type": "module"在您的package.json文件中添加该行。

{

  "type": "module"

}

三、--experimental-modules调用nodejs时使用flag：

node --experimental-modules app.js

你应该很高兴去！

另一种方法是避免在 package.json 文件中添加 "type": "module" 行，而是将 app.js 文件重命名为 app.mjs。

请注意，现在require()语法将停止工作。

Answer 2

你只需要像这样更新package.json，

{"type": "module"}

这对我有用，谢谢！

Answer 3

这是我的方法：

1 - 更新 package.json 像：

  "main": "index.js",
  "type":"module",

2 - 导入时使用.js，例如：

import {isPrime} from './isPrime.js';

3 - 这是 isPrime.js

export const isPrime ....

Answer 4

在 package.json 中添加 Type: module - 有帮助:)

package.json 包含：

{
  "name": "react_template",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "type": "module",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "webpack": "^5.30.0",
    "webpack-cli": "^4.6.0"
  }
}

Answer 5

对于那些将 TypeScript 与 node.js 一起使用，并且正在尝试使用该import语句的人。我发现将中module的值设置为会出现此错误，而将其设置为有效。es2015tsconfig.jsoncommonjs

tsconfig.json

    {
     "module": "commonjs"
    }