Heim > Web-Frontend > View.js > So beheben Sie den Fehler, wenn vue3 einen Alias ​​verwendet

So beheben Sie den Fehler, wenn vue3 einen Alias ​​verwendet

王林
Freigeben: 2023-05-11 09:43:05
nach vorne
1071 Leute haben es durchsucht

Lösen Sie das Problem der Fehlerberichterstattung bei der Verwendung von Aliasen in vue3:

Auf vue-cli3 und höher wird der Alias ​​automatisch konfiguriert, wenn Sie ein vue3-Projekt erstellen und Typoskript verwenden.

Gefunden in tsconfig.json

"baseUrl": ".",
"paths": {
      "@/*": [
        "src/*"
      ]
    }
"include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx"
  ]
Nach dem Login kopieren

unter dem Stammpfad des Projekts

const path = require('path')
function resolve(dir) {
    return path.join(__dirname, dir);
}
module.exports = {
    configureWebpack: {
        resolve: {
            alias: {
                '#': resolve('src'),
            }
        }
    },
}
Nach dem Login kopieren

Das Problem besteht zunächst darin, dass Ihr Pfad korrekt ist. Wenn Sie das

vetur-Plugin verwenden, meldet es sich immer dass der Alias-Pfad nicht gefunden werden kann

Sie können also direkt

die Konfiguration in der Konfiguration des Vetur-Plug-Ins ändern

Öffnen Sie die Einstellungen und suchen Sie das

Vetur-Plug-In So beheben Sie den Fehler, wenn vue3 einen Alias ​​verwendet

Suchen Sie

setting.json

Konfiguration So beheben Sie den Fehler, wenn vue3 einen Alias ​​verwendet

Hinzufügen von „vetur.validation“ in setting.json

script“: false

So beheben Sie den Fehler, wenn vue3 einen Alias ​​verwendet

kann das

vetur

-Fehlermeldeproblem lösenEs ist nicht erforderlich,

hinzuzufügen vue.config.js

-Datei in diesem Projekt

Anhang: Alias-Einstellungen in vue

Für Vue 3.0+ erstellen Sie eine neue vue.config.js.

import Login from '#/views/Login.vue'
Nach dem Login kopieren

In unserer Routing-Datei kann es geschrieben werden als

const path = require('path')
 
function resolve(dir) {
    return path.join(__dirname, dir);
}
module.exports = {
    configureWebpack: {
        resolve: {
            alias: {
                '#': resolve('src'),
                'views':resolve('src/views'),
            }
        }
    },
 
}
import Vue from 'vue'
import VueRouter from 'vue-router'
import Login from 'views/Login.vue'
Nach dem Login kopieren

Für ein weiteres Beispiel setzen wir den Alias ​​des Verzeichnisses src/views auf „views“

rrreee🎜Hinweis: Die selbst erstellte vue.config.js und die Standardkonfiguration werden in der endgültigen Konfiguration zusammengeführt. 🎜

Das obige ist der detaillierte Inhalt vonSo beheben Sie den Fehler, wenn vue3 einen Alias ​​verwendet. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:yisu.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage