Everything seems to be in working order. I have successfully utilized the components and managed to build the app without encountering any issues. However, my text editor (VS Code) continues to throw a linting error even after attempting to register my own components. The problem persists both in this Electron-based project and when trying to create one using the actual CLI. It's worth mentioning that all installations were done today on a fresh machine.
Vue: v3.2.36 Vite: v2.9.9 Node: v18.3.0 NPM: v8.11.0
Even changing the name of my init file from client.ts to main.ts does not resolve the issue.
import { createApp } from "vue";
import App from "./App.vue";
import { Icon } from "@vicons/utils";
import {
NButton,
NCard,
NTabs,
NTabPane,
NInput,
NInputNumber,
NSelect,
NDataTable,
NButtonGroup,
NScrollbar,
NModal,
} from "naive-ui";
const app = createApp(App);
app.component("Icon", Icon)
.component("Button", NButton)
.component("Card", NCard)
.component("Tabs", NTabs)
.component("TabPane", NTabPane)
.component("Input", NInput)
.component("InputNumber", NInputNumber)
.component("Select", NSelect)
.component("DataTable", NDataTable)
.component("ButtonGroup", NButtonGroup)
.component("Scrollbar", NScrollbar)
.component("Modal", NModal)
.mount("#app");
tsconfig.json
{
"compilerOptions": {
"target": "esnext",
"useDefineForClassFields": true,
"module": "esnext",
"moduleResolution": "node",
"strict": true,
"jsx": "preserve",
"sourceMap": true,
"resolveJsonModule": true,
"esModuleInterop": true,
"lib": ["esnext", "dom"],
"paths": {
"@components": ["./components"],
"@domain": ["./domain"],
"@helpers": ["./helpers"],
"@views": ["./views"]
}
},
"include": ["./**/*.ts", "./**/*.d.ts", "./**/*.tsx", "./**/*.vue"]
}
An example of the linting error can be seen in this image: https://i.sstatic.net/e5n5w.png
Additionally, a warning message has been appearing in my terminal. Here is an image for reference: