npm create vuetify@latest
< /code>
Это мой login.vue < /p>
//import arrowData from "./arrow.svg"
< /code>
Это мой main.js: < /p>
/**
* main.js
*
* Bootstraps Vuetify and other plugins then mounts the App`
*/
import { VueSvgIconPlugin } from '@yzfe/vue-svgicon'
import '@yzfe/svgicon/lib/svgicon.css'
// Plugins
import { registerPlugins } from '@/plugins'
// Components
import App from './App.vue'
// Composables
import { createApp } from 'vue'
const app = createApp(App)
registerPlugins(app)
app.mount('#app')
app.use(VueSvgIconPlugin, {tagName: 'icon'})
< /code>
Это моя стрелка.svg: < /p>
.st0{display:none;fill:#191919;}
.st1{display:none;fill-rule:evenodd;clip-rule:evenodd;fill:#191919;}
.st2{display:none;}
.st3{display:inline;fill-rule:evenodd;clip-rule:evenodd;fill:#191919;}
.st4{display:inline;fill:#191919;}
.st5{fill:#191919;}
l-13.9,21.6c-1.9-1-4.1-1.6-6.4-1.6c-7.3,0-13.3,5.8-13.3,13c0,7.2,5.9,13,13.3,13s13.3-5.9,13.3-13c0-2.9-0.9-5.5-2.5-7.7
l14.4-22.3c1.4,0.5,2.9,0.8,4.5,0.8c7.3,0,13.3-5.8,13.3-13s-5.9-13-13.3-13c-5.4,0-10,3.2-12.1,7.7l-40.7-8.1
c-0.1-4.1-2.1-7.7-5.2-10l10.1-23.5c1,0.2,2,0.4,3.1,0.4c7.3,0,13.3-5.8,13.3-13S59.5,0,52.2,0c-7.3,0-13.3,5.8-13.3,13
c0,4.2,2,7.9,5.1,10.3L33.8,46.9c-0.9-0.2-1.9-0.3-2.8-0.3C23.7,46.6,17.7,52.4,17.7,59.6z M45.5,13c0-3.6,3-6.5,6.6-6.5
c3.7,0,6.6,2.9,6.6,6.5s-3,6.5-6.6,6.5C48.5,19.6,45.5,16.6,45.5,13z M90.4,72.7c0-3.6,3-6.5,6.6-6.5c3.7,0,6.6,2.9,6.6,6.5
s-3,6.5-6.6,6.5C93.3,79.2,90.4,76.3,90.4,72.7z M67.3,108.4c3.7,0,6.6,2.9,6.6,6.5c0,3.6-3,6.5-6.6,6.5c-3.7,0-6.6-2.9-6.6-6.5
C60.7,111.3,63.7,108.4,67.3,108.4z M24.4,59.6c0-3.6,3-6.5,6.6-6.5c3.7,0,6.6,2.9,6.6,6.5c0,3.6-3,6.5-6.6,6.5
C27.3,66.2,24.4,63.2,24.4,59.6z"/>
< /code>
Но когда я собираюсь увидеть значок, я вижу: < /p>
Я аспект, чтобы увидеть значок или ошибку, но я не вижу ни одной ошибки, ни значка
А также, если я собираюсь изменить login.vue таким образом: < /p>
import arrowData from "./arrow.svg"
<
< /code>
во время компиляции я получаю: < /p>
C:\Users\vis\Corso_vue\prova3\mybadge>npm run dev
> mybadge@0.0.0 dev
> vite
VITE v5.4.14 ready in 518 ms
➜ Local: http://localhost:3000/
➜ Network: use --host to expose
➜ press h + enter to show help
21:53:31 [vite] hmr update /src/views/session/Login.vue
21:53:31 [vite] Internal server error: Failed to resolve import "./arrow.svg" from "src/views/session/Login.vue". Does the file exist?
Plugin: vite:import-analysis
File: C:/Users/vis/Corso_vue/prova3/mybadge/src/views/session/Login.vue:2:22
1 | /* unplugin-vue-components disabled */import { defineComponent as _defineComponent } from "vue";
2 | import arrowData from "./arrow.svg";
| ^
3 | const _sfc_main = /* @__PURE__ */ _defineComponent({
4 | __name: "Login",
at TransformPluginContext._formatError (file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:49257:41)
at TransformPluginContext.error (file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:49252:16)
at normalizeUrl (file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:64199:23)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:64331:39
at async Promise.all (index 1)
at async TransformPluginContext.transform (file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:64258:7)
at async PluginContainer.transform (file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:49098:18)
at async loadAndTransform (file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:51931:27)
at async viteTransformMiddleware (file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:62031:24)
Я знаю, что в одном вопросе есть две проблемы, но я трачу весь день, пытаясь решить проблему, но вообще нет надежды.
Я следую указаниям в: https://mmf-fe.github.io/svgicon/guide/#vue-3-xобразно Я только что изменяю arrow.svg (я не знаю в файле Witch, документация относится): < /p> Также я создал проект с: < /p> [code]npm create vuetify@latest < /code> Это мой login.vue < /p>
//import arrowData from "./arrow.svg"
< /code> Это мой main.js: < /p> /** * main.js * * Bootstraps Vuetify and other plugins then mounts the App` */
import { VueSvgIconPlugin } from '@yzfe/vue-svgicon' import '@yzfe/svgicon/lib/svgicon.css'
// Plugins import { registerPlugins } from '@/plugins'
// Components import App from './App.vue'
// Composables import { createApp } from 'vue'
const app = createApp(App)
registerPlugins(app)
app.mount('#app')
app.use(VueSvgIconPlugin, {tagName: 'icon'}) < /code> Это моя стрелка.svg: < /p>
< /code> Но когда я собираюсь увидеть значок, я вижу: < /p>
Я аспект, чтобы увидеть значок или ошибку, но я не вижу ни одной ошибки, ни значка А также, если я собираюсь изменить login.vue таким образом: < /p>
import arrowData from "./arrow.svg"
<
< /code> во время компиляции я получаю: < /p>
C:\Users\vis\Corso_vue\prova3\mybadge>npm run dev
> mybadge@0.0.0 dev > vite
VITE v5.4.14 ready in 518 ms
➜ Local: http://localhost:3000/ ➜ Network: use --host to expose ➜ press h + enter to show help 21:53:31 [vite] hmr update /src/views/session/Login.vue 21:53:31 [vite] Internal server error: Failed to resolve import "./arrow.svg" from "src/views/session/Login.vue". Does the file exist? Plugin: vite:import-analysis File: C:/Users/vis/Corso_vue/prova3/mybadge/src/views/session/Login.vue:2:22 1 | /* unplugin-vue-components disabled */import { defineComponent as _defineComponent } from "vue"; 2 | import arrowData from "./arrow.svg"; | ^ 3 | const _sfc_main = /* @__PURE__ */ _defineComponent({ 4 | __name: "Login", at TransformPluginContext._formatError (file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:49257:41) at TransformPluginContext.error (file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:49252:16) at normalizeUrl (file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:64199:23) at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:64331:39 at async Promise.all (index 1) at async TransformPluginContext.transform (file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:64258:7) at async PluginContainer.transform (file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:49098:18) at async loadAndTransform (file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:51931:27) at async viteTransformMiddleware (file:///C:/Users/vis/Corso_vue/prova3/mybadge/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:62031:24) [/code] Я знаю, что в одном вопросе есть две проблемы, но я трачу весь день, пытаясь решить проблему, но вообще нет надежды.