now i use vue-cli#5.0.3 and eslint#8.11.0.
now eslint is woking, it can find my .vue or .ts probleam,
but my console is empty
thk
I try config lintOnSave to vue.config.js, and use eslint-webpack-plugin
but it don't work
Related
I am using #vue/cli 4.5.8; "sass-loader": "^8.0.2"
I am trying to make an scss file globally accessible in the vue project.
I made a scss file called style.scss. This file include varible.scss, mixin.scss and bootstrap.scss. All sass files are in /scss folder.
Now in My main.js I import "./scss/style.scss". But it doesn't work. I got sass error: variable undefined.
I know we can use sass-loader to make the style.scss globally available by setup vue.config.js, but I just want to know could this method work, because I've see people on the stackoverflow mentioned this approch.
I had follow the reference : https://eslint.org/docs/user-guide/configuring#ignoring-files-and-directories, but it does not work
I want to disable it, because I have many warning when run npm run serve about extra semicolon, spaces etc
My project using vuetify
I make .eslintignore and add script like this :
../src/*.js
I try to run npm run serve, but the warning is still exist
I try to add :
"eslintIgnore": ["store.js", "Home.vue"] in the package.json, but it also does not work
Whereas I had follow the docs
How can I solve this problem?
Update :
I try change like this :
src/**/*.js
src/**/*.vue
It does not work
Eslint lint is a javascript opensource for linting utility. When you install a project using Vue cli, it automatically adds eslint-plugin to your project. It will have a es6 syntaxes guidelines, You can also create or disable the eslint rules.
If you want to disable eslint for a single line
just append this to a line of code
javascript code // eslint-disable-line
If you want to disable eslint for a complete file
/* eslint-disable */
code
/* eslint-disable */
If you want to remove eslint completely from a project which is
created by vue cli 2
Set useEslint: false, in config/index.js
If you are using vue cli 3
In .eslintrc.js just set
root: false
Else, if you want to remove eslint completely from project
npm remove #vue/cli-plugin-eslint
If you have .eslintignore, you can add these lines there
/build/
/config/
/dist/
/*.js
/test/unit/coverage/
/000-xyz/
How to use: https://github.com/w3c/IntersectionObserver/tree/master/polyfill
Should i load it in a webpack config - vue.config.js or should i load it in a .vue template using imports?
npm install intersection-observer
Add this line to the top of your entry file (such as main.js)
import 'intersection-observer/intersection-observer';
That's all.
I'm having some issues with caching my files using the default service worker that comes with VueCLI 3. I would prefer to just use the default browser caching mechanism, but can't seem to disable the PWA plugin as its not in the vue.config.js file. Passing a blank object to the pwa option doesn't work either as the object is merged and not overwritten.
I resolved this by doing the following:
Removing the registerServiceWorker.js file
removing the import of registerServiceWorker.js from main.js.
removing the PWA plugin from the devDependencies in package.json.
Vue enabled a method to disable pwa for certain builds in version 4. Now you can add --skip-plugins pluginname during your build. This one worked for me just fine:
npx vue-cli-service build --skip-plugins pwa,workbox
Ref: https://cli.vuejs.org/guide/cli-service.html#skipping-plugins
There is an open but accepted proposal to add this to the core functionality:
https://github.com/vuejs/vue-cli/issues/3830
EDIT:
Via command line:
https://cli.vuejs.org/guide/cli-service.html#skipping-plugins
npx vue-cli-service build --skip-plugins pwa,workbox
Via vue.config.js:
module.exports = {
chainWebpack: config => {
config.plugins.delete('pwa');
config.plugins.delete('workbox');
}
}
I have this really simple webpack projects in with I now want to also use bulma a css framework.
I installed the package via npm i bulma and tried to include it inside my app.js-file using the following snipped unsuccessfully:
import bulma from '~bulma/bulma.sass';
I also tried using a specific sass part, which also did not work:
import bulma from '~bulma/sass/base/_all';
Can you help me get this working or maybe point me in the right direction?
You need to update your webpack config file so the sass loader also processes sass files, not only scss files.
Change this line:
test: /\.scss$/, to test: /\.(sass|scss)$/