錯誤:無法在React模組之外使用import語句
P粉920485285
P粉920485285 2023-09-20 12:45:39
0
1
572

我剛開始學習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": [] }

熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板