错误:无法在React模块之外使用import语句
P粉920485285
P粉920485285 2023-09-20 12:45:39
0
1
575

我刚开始学习React。我按照https://react.dev/learn/add-react-to-an-existing-project上的入门指南进行了步骤,但是我一直遇到错误:无法在模块外部使用import语句。

我做的是: 首先在终端中执行: npm init -y npm install React React-dom

然后我创建了一个index.js文件,并复制了指南中提供的代码: `从'react-dom/client'导入{createRoot};

// 清除现有的HTML内容 document.body.innerHTML = '';

// 渲染你的React组件 const root = createRoot(document.getElementById('app')); root.render(

你好,世界

);`

但是它没有起作用。

几乎所有的互联网解决方案都告诉我在package.json文件中添加"type": "module。 我确实添加了它,但错误仍然存在。

这是我添加的方式: { "name": "project", "devDependency": { "vite": "latest" }, "scripts": { "type": "module", "start": "vite", "dev": "vite", "build": "vite build", "preview": "vite 预览" }, "type": "module", "description": "快速启动:", "version": "1.0.0" , "main": "index.js", "author": "", "license": "ISC", "dependency": { "react": "^18.2.0", "react-dom": "^ 18.2.0" }, "关键字": [] }

在script标签内部添加"type": "module也不起作用: 实际上,在添加这个后,React完全崩溃了,因为它显示不识别符号'<'...

我尝试过并且确实起作用的方法是不实际下载React,而是插入CDN并使用babel。但是根据我正在学习的免费课程,使用CDN不是使用React的好方法。

我完全迷失了。有人能帮忙吗?

P粉920485285
P粉920485285

全部回复(1)
P粉183077097

您需要在顶层对象中添加"type": "module",而不是在"scripts"对象中添加。

"scripts"对象中的内容可以通过npm run <x>来访问,其中<x>是"scripts"对象中的键。

{ "name": "project", "type": "module", "devDependencies": { "vite": "latest" }, "scripts": { "start": "vite", "dev": "vite", "build": "vite build", "preview": "vite preview" }, "type": "module", "description": "Quick start:", "version": "1.0.0", "main": "index.js", "author": "", "license": "ISC", "dependencies": { "react": "^18.2.0", "react-dom": "^18.2.0" }, "keywords": [] }

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板