I can't install vuetify. error Component name "Home" should always be multi-word vue/multi-word-component-names
Below is the full message:
There are uncommitted changes in the current repository, it's recommended to commit or stash them first.
? Still proceed? yes
๐ฆ Installing vue-cli-plugin-vuetify...
up to date, audited 1735 packages in 9s
164 packages are looking for funding
run npm fund for details
17 vulnerabilities (6 moderate, 11 high)
To address issues that do not require attention, run:
npm audit fix
To address all issues (including breaking changes), run:
npm audit fix --force
Run npm audit for details.
โ Successfully installed plugin: vue-cli-plugin-vuetify
? Choose a preset: Vuetify 2 - Vue CLI (recommended)
๐ Invoking generator for vue-cli-plugin-vuetify...
WARN conflicting versions for project dependency "sass-loader":
- ^12.0.0 injected by generator "undefined"
- ^10.0.0 injected by generator "vue-cli-plugin-vuetify"
Using newer version (^12.0.0), but this may cause build errors.
โ Running completion hooks...
C:\Users\allan\Downloads\Projects\curso-vue\vue-cli\project-plugins\src\views\HomeView.vue
9:11 error Component name "Home" should always be multi-word vue/multi-word-component-names
โ 1 problem (1 error, 0 warnings)
So far I have tried to change the Component name "Home" to "HomeView" in the homeView.vue
but when trying this, I realize that after trying to install vuetify again, when the process is terminated, the "HomeView" returns to being "Home"
I tried the ways below but the error remains:
first try:
{
"vue/multi-word-component-names": ["error", {
"ignores": [Home]
}]
}
second try:
{
"vue/multi-word-component-names": ["error", {
"ignoreIfComponentName": "/^[a-z]+$/"
}],
}
I tried the 2 ways in .eslintrc.js what could I be doing wrong?
I am using Nuxt with apollo for a project, Everything is working perfectly on a local server but on the live server, the CSS is broken for the plugins I used. I used these two plugins
vue-awesome-swiper
v-lazy-image
plugins: [
{ src: "~/plugins/vue-awesome-swiper", mode: "client" },
{ src: "~/plugins/v-lazy-image", mode: "client" }],
Here is a live demo chatfata.com. as you can see the slider is broken and blur effect in not removing after the image is render.
I am facing one more problem maybe its related to this as it's my first time using Graphql with NUXT.
On the live server, npm run build is not working. it gives some kind of node_modules/babel-loader/lib?? no recognizing the. .gql extension as you can see the screenshot
So I do npm run build on local server and upload the files to live server. I don't if both errors are related
I need help
Thanks
Run this command below:
npm install babel-loader #babel/core
And then run:
npm install && npm run build
I've been trying to use ESLint along with Standard and I haven't been able to get it to work. I've tried setting it up through eslint --init, uninstalling eslint globally and having all the packages locally, installing each package manually npm install --save-dev eslint eslint-config-standard eslint-plugin-standard eslint-plugin-promise eslint-plugin-import eslint-plugin-node, reinstalling ESLint extension and nothing so far. I'm perfectly able to run ./node_modules/.bin/eslint --fix ... in order to fix/check errors but it doesn't work with the VSCode extension by any meanings. I don't have prettier so it isn't related to it either.
Output:
[Info - 12:33:20 AM] ESLint server is running.
[Info - 12:33:23 AM] ESLint library loaded from: c:\Users\h08FXplsV8\Documents\dev\node\graphql-bootcamp\graphql-prisma\node_modules\eslint\lib\api.js
[Error - 12:33:25 AM]
Failed to load plugin 'import' declared in 'graphql-prisma\.eslintrc ยป eslint-config-standard': Cannot find module 'eslint-plugin-import'
Require stack:
- C:\Users\h08FXplsV8\Documents\dev\node\graphql-bootcamp\__placeholder__.js
Happened while validating C:\Users\h08FXplsV8\Documents\dev\node\graphql-bootcamp\graphql-prisma\src\resolvers\index.js
This can happen for a couple of reasons:
- The plugin name is spelled incorrectly in an ESLint configuration file (e.g. .eslintrc).
- If ESLint is installed globally, then make sure 'eslint-plugin-import' is installed globally as well.
- If ESLint is installed locally, then 'eslint-plugin-import' isn't installed correctly.
.eslintrc:
{
"env": {
"es6": true,
"node": true
},
"extends": [
"standard"
],
"globals": {
"Atomics": "readonly",
"SharedArrayBuffer": "readonly"
},
"parserOptions": {
"ecmaVersion": 2018,
"sourceType": "module"
},
"rules": {
}
}
I've seen other questions in SO related to this issue but none of the solutions worked, unfortunately.
I had the same issue for many weeks and finally found this thread and comment on Github: https://github.com/microsoft/vscode-eslint/issues/696#issuecomment-542592372
My issue turned out to be related to subdirectories. As soon as I made the project the only open project with an .eslintrc.js file, all of my linting issues went away.
Hopefully this works for you.
To fix the dependency tree, try following these steps in the exact order:
Delete package-lock.json (not package.json!) and/or yarn.lock in your project folder.
Delete node_modules in your project folder.
Remove "babel-eslint" from dependencies and/or devDependencies in the package.json file in your project folder.
Run npm install or yarn, depending on the package manager you use.
Also, be sure, that you have latest version of "eslint-plugin-import" plugin, as in my case, for example i had this error with "2.20.1" version, but latest "2.25.3" solved this issue
I had the same error caused by the eslint-plugin-import dependency and in my case, I got rid of the error by increasing to the latest version of the package.
For those having the following error with flutter firebase cloud functions after running firebase init functions and trying to run firebase deploy --only functions:
ESLint: 8.9.0
Error: Failed to load plugin 'import' declared in '.eslintrc.js': Cannot find module 'es-abstract/2021/RequireObjectCoercible'
Require stack:
- C:\Users\xx\Documents\xx\xx\functions\node_modules\eslint-plugin-import\lib\ExportMap.js
- C:\Users\xx\Documents\xx\xx\functions\node_modules\eslint-plugin-import\lib\rules\named.js
- C:\Users\xx\Documents\xx\xx\functions\node_modules\eslint-plugin-import\lib\index.js
- C:\Users\xx\Documents\xx\xx\functions\node_modules\#eslint\eslintrc\dist\eslintrc.cjs
This was solved by:
delete node_modules in functions folder
delete package-lock.json in functions folder
cd .\functions\ in the terminal to get into functions folder, run npm i, cd ../
firebase deploy --only functions
I am having this issue too which was why I checked this post but did not see any answer that work for me. After searching online, I stumbled into this code which solves my problem.
npm i -D eslint #typescript-eslint/eslint-plugin
In my case, i was not using jest at all.
So i had to downgrade de eslint dev dependency:
"eslint": "^7.32.0",
as it say here: https://github.com/eslint/eslint/issues/15149#issuecomment-939501275
Trying to have oraclejet wotking in a nuxt.jet basic project.
I generated a simple nuxt project and was working ok .
Then added oraclejet and typed :
npm install --save oraclejet
Then added in nuxt.config.js :
modules: [
'oraclejet'
],
Then running
npm run dev
There is no errors starting but when i go to http://127.0.0.1:3000 i'm getting :
Cannot GET /
without any errors
Can anyone help ?
Thanks
I'm trying to install jwt-decode to my aurelia cli application. I've npm installed the library and added it to my aurelia.json file:
"dependencies": [
... other deps
{
"name": "jwt-decode",
"path": "../node_modules/jwt-decode/lib",
"main": "index"
}
... other deps
]
When I run au build or au run everything compiles and I can see the the cli is tracing the jwt-decode package; however, when I try to include it in a file I get an error:
src/stores/auth/service.ts(4,24): error TS2307: Cannot find module 'jwt-decode'.
[22:13:04] gulp-notify: [Error running Gulp] Error: src/stores/auth/service.ts(4,24): error TS2307: Cannot find module 'jwt-decode'.
[22:13:04] TypeScript: 1 semantic error
[22:13:04] TypeScript: emit succeeded (with errors)
I've even tried adding it to the prepend property but it did not work. I'm also using typescript so I don't know if that could be causing an issue.
Your dependencies section in aurelia.json is correct.
This error is related to TypeScript: typing definition (.d.ts file) is missing for 'jwt-decode' package.
You can install it by typings install dt~jwt-decode --global --save
After that, import it as a global module: import * as jwt from 'jwt-decode';