Hi i'm facing somewhat a strange problem during $npm run serve
here is my page structure
<template>
<div>
...
</div>
</template>
<script>
export default {
name: 'game',
...
}
</script>
<style lang="scss" scoped>
$variable1:#fff;
....
</style>
My package.json looks something like this
"devDependencies":{
"node-sass": "^6.0.0",
"sass-loader": "^10.1.0",
"vue-loader-v16": "npm:vue-loader@^16.1.1"
}
Generally this kind of error happens when you try to access a property of an object that does not (yet) exist.
So I think somewhere in your code you try to access someObject.spaces but someObject is undefined. To avoid this, you can add a simple if-clause before your operation:
if(someObject){
doSomething(someObject.spaces)
}
I think you'll have to fill in more code to identify exactly what happens, though.
Check your styles U should use
::v-deep() { a { color: red; }}
instead of
::v-deep { a { color: red; }}
I think you did not define the state in the right way
I suppose that somewhere you call spaces like this game.spaces with defining game: undefined. The right way to define the game state with a default value is an empty object like this:
<script>
export default {
name: 'game',
data(){
game: {}
}
}
</script>
Or You can use ?. Optional chaining to avoid this error like game?.spaces. See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining
