英文:
react vite importing img from assets error
问题
我尝试导入一个标志，但一直出现这个错误。该标志位于我的 src 文件夹中的 assets 文件夹内。
import React from 'react';
import {logo} from '../assets';
const Navbar = () => {
return (
<div className='w-full h-[80px] bg-white border-b'>
<div className='max-w-[1480px] m-auto w-full h-full flex justify-between items-center'>
<img src={logo} />
</div>
</div>
)
}
export default Navbar
而我收到的错误是：[vite] 内部服务器错误：无法解析从 "src\components\Navbar.jsx" 导入的 " ../assets"。该文件是否存在？
我尝试了许多不同的方法，以为是语法错误，但都没有成功。
英文:
i am trying to import a logo but i keep getting this error. the logo is in the assets in my src folder.
import React from 'react';
import {logo} from '../assets'
const Navbar = () => {
return (
<div className='w-full h-[80px] bg-white border-b'>
<div className='max-w-[1480px] m-auto w-full h-full flex justify-between items-center'>
<img src={logo} />
</div>
</div>
)
}
export default Navbar
and the error i get is this. [vite] Internal server error: Failed to resolve import "../assets" from "src\components\Navbar.jsx". Does the file
exist?
i tried using lots of different ways thinking it was a syntax error but nothing worked.
答案1
得分: 1
尝试使用以下行
import logo from '../assets/logo.png'; //更改文件扩展名
英文:
Try with the following line
import logo from '../assets/logo.png'; //change file extension
答案2
得分: 0
我正在JS Mastery上参与“在React JS中使用Tailwind构建和部署具有现代UI/UX的完全响应式网站”视频项目，并遇到了这篇帖子。我相当确信我们正在处理同样的问题。如果是这样，你的问题可能来自constants/index.jsx中的第一个导入语句。如果你还没有创建所引用的导入（people01、people02、people03等），那么它将抛出一个错误。将这一行注释掉，它应该能正常工作！
英文:
I'm working on the 'Build and Deploy a Fully Responsive Website with Modern UI/UX in React JS with Tailwind' video on JS Mastery and came across this post. I'm pretty sure we're working on the same thing here. If so, your issue is probably coming from that first import statement in constants/index.jsx. If you have not created the imports referenced (people01, people02, people03, etc) then it will throw an error. Comment out this line & it should work!
答案3
得分: 0
我也在做同一门课程，我认为你犯了和我一样的错误，当你解压资产文件夹时，请注意里面可能有另一个"assets"文件夹，这是由于解压而产生的。所只需将文件从内部的"assets"文件夹剪切并粘贴到外部的"assets"文件夹，然后尝试运行代码。
英文:
I am also working on the same course and I think you've done the same mistake as me, when you unzipped the assets folder, note that there might be another "assets" folder inside it, due to unzipping.
So just cut and paste your files from the inner assets folder to the outer assets folder, and try the code.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论