explain
After the react project is compiled, sometimes the following error will be reported if you enter cnpm start
Add the following code to the package.json file to specify the version
"resolutions": {
"css-animation": "1.5.0",
"rc-animate": "2.8.2"
},
Add the following configuration in dependencies
"css-animation": "1.5.0",
"rc-animate": "2.8.2",
Using Vue neditor wrap
When we use a rich text editor in a project, a style of null error may occur
solve
1. Let’s check the version of Vue in package.lock.json file first. The version of Vue neditor wrap must be above vue2, and 1. Several versions cannot use
2. Use NPM instead of yarn when downloading dependencies
tsconfig.json
"paths": {
"@/*": ["src/*"]
},
Err: an error is reported and the path cannot be found
solution: vscode open the workspace and save the file in the workspace
The following error is reported after executing yarn serve :
Solution:
Modify scripts and Vue cli service in package.json to full path reference, as shown in the following figure:
Build and lint are the same
I used to be less in Vue. Today I tried sass on a whim, and then the error will be reported when running sasserror: expected newline
After studying for a long time, I found that there is a pit here. You can’t write sass in style if you use sass in Vue
It has to be written as SCSS
Change it so that you won’t report an error
The error contents are as follows:
PM2: unable to load file D: \ software \ node \ node_ Global \ pm2.ps1 because running scripts is prohibited on this system. For more information, see about in HTTPS:/go. Mic
Microsoft. COM/fwlink /?LINKID = 135170_ Execution_ Policies。
resolvent
Run PowerShell as an administrator, execute the set executionpolicy remotesigned command, and then enter y.
The or operator is used when the routing guard of the Vue item is in progress,
router.beforeEach((to,from,next) => {
store.commit('cookie/getToken')
let token = store.state.cookie.token
if(!token && to.name === 'PersonalHome'||'Edit'||'EditBlog'||'EditDraft') {
next('login')
} else {
next()
}
})
Browser error:
solution:
wrap or calculate with ()
if(!token && to.name === ('PersonalHome'||'Edit'||'EditBlog'||'EditDraft')) {
next('login')
} else {
next()
}
If you want to clear the data in Vue, the error may be the reason why you haven’t changed the direction of this. You can try to change the direction of this with call, for example
Object.assign(this.$data, this.$options.data.call(this))
If you just want to know one of the data, you can use it
this.xxx=this.$options.data.call(this).xxxx
<div v-if="grade<3" ref="gradeChart" style="height: 220px;width: 300px;margin:0 auto;">
mounted() {
this.$nextTick(() => {
setTimeout(()=>{
let map1=this.initEchartMap(this.gjfsx);
console.log(this.$refs.gradeChart,"ddkiiok")
},50)
})
The solution is to change V-IF to v-show, and the console will not report an error
<div v-show="grade<3" ref="gradeChart" style="height: 220px;width: 300px;margin:0 auto;">In the vue2 version, I usually use require. Context to get all the files of a file
require.context('./modules', true, /\.js$/)
Errors will be reported when using vue3 vite
go to the vite official document and find the official provision method as follows
import.meta.globEager("./module/*.js")
Q: the Vue console reports an error duplicate keys detected: ‘XXXX’. This may cause an update error. Solution
Analysis: duplicate key: ‘0’. 0 ‘may cause an update error; This problem usually occurs because there are multiple V-for loops on the same page, and the key of the loop is index. You can define the key as a unique value, such as code or ID. this can be solved
A: the value of the drop-down box must be unique. Check the value of the drop-down box
This error is always reported when using vuex: error in created hook: “typeerror: cannot read property ‘commit’ of undefined”
It was found that the global store was not introduced in main.js
import store from ‘store/store.js’
const app = new Vue({ …App, store })
Record it here and remind yourself to remember