Uncaught SyntaxError: React 中参数列表后缺少 )

huangapple go评论81阅读模式
英文:

Uncaught SyntaxError: missing ) after argument list in React

问题

I used vite for creating a React-typescript project, and I got a blank page with the error :

Uncaught SyntaxError: missing ) after argument list (at main.tsx:6:51)

in main.tsx :

import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App.tsx";
import "./index.css";

ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

the error has explained in :

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Missing_parenthesis_after_argument_list

But it's not similar to my problem

英文:

I used vite for creating a React-typescript project, and I got a blank page with the error :

Uncaught SyntaxError: missing ) after argument list (at main.tsx:6:51)

in main.tsx :

import React from &quot;react&quot;;
import ReactDOM from &quot;react-dom/client&quot;;
import App from &quot;./App.tsx&quot;;
import &quot;./index.css&quot;;

ReactDOM.createRoot(document.getElementById(&quot;root&quot;) as HTMLElement).render(
  &lt;React.StrictMode&gt;
   &lt;App /&gt;
  &lt;/React.StrictMode&gt;
);

the error has explained in :

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Missing_parenthesis_after_argument_list

But it's not similar to my problem

答案1

得分: 0

根据错误位置,似乎可能是因为 Typescript 配置不正确。如果尚未尝试过,请尝试使用 Vite 的 "create" 脚本之一来设置项目,如 https://vitejs.dev/guide/#scaffolding-your-first-vite-project 中所示,

yarn create vite my-app --template react-ts

确保像上面示例中那样选择一个 Typescript 模板,比如 react-ts。

英文:

Given the location of the error, seems it could be due to having Typescript improperly set up. If you haven't already, try using one of Vite's "create" scripts to set up the project as show in https://vitejs.dev/guide/#scaffolding-your-first-vite-project,

yarn create vite my-app --template react-ts

Make sure to select a Typescript template such as react-ts in the example above.

答案2

得分: -1

It seems that you're using an incorrect import statement for the ReactDOM module. Instead of importing from "react-dom/client", you should import from "react-dom". I've never seen that kind of import ever.

Here's the corrected code:

import React from "react";
import ReactDOM from "react-dom";
import App from "./App.tsx";
import "./index.css";

ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

Make sure to update the import statement for ReactDOM, and try running your project again. This should resolve the "missing ) after argument list" error and render your React app correctly.

Hope this works!
英文:

It seems that you're using an incorrect import statement for the ReactDOM module. Instead of importing from "react-dom/client", you should import from "react-dom". I've never seen that kind of import ever.

Here's the corrected code:

import React from &quot;react&quot;;
import ReactDOM from &quot;react-dom&quot;;
import App from &quot;./App.tsx&quot;;
import &quot;./index.css&quot;;

ReactDOM.createRoot(document.getElementById(&quot;root&quot;) as 
   HTMLElement).render(
   &lt;React.StrictMode&gt;
    &lt;App /&gt;
   &lt;/React.StrictMode&gt;
 );

Make sure to update the import statement for ReactDOM, and try running your project again. This should resolve the "missing ) after argument list" error and render your React app correctly.

Hope this works!

huangapple
  • 本文由 发表于 2023年6月29日 21:58:47
  • 转载请务必保留本文链接:https://go.coder-hub.com/76581748.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定