Integrated sass error reporting in vue-cli - Codes Helper

npm install node-sass sass-loader built with vue-cli-- save-dev
installed normally

The

code is as follows:
< template >
< div class= "tabMain" >

<table>
  <thead>
    <tr>
        <th>1</th>
        <th>1</th>
        <th>1</th>
        <th>1</th>
    </tr>
  </thead>
  <tbody>
    <tr>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
    </tr>
    <tr>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
    </tr>
    <tr>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
    </tr>
    <tr>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
    </tr>
  </tbody>
</table>

< / div >
< / template >

< script >
export default {
name: "HelloWorld",
data () {

return {
  // msg: "Welcome to Your Vue.js App"
}

}
}
< / script >

< style lang= "sass" scoped >
.tabMain {

}

< / style >

sass reported an error as follows

Module build failed:
undefined
        ^
      Invalid CSS after ".tabMain{": expected "}", was "{}"
      in D:\wYcom\braTab\src\components\braTab.vue (line 61, column 10)

 @ ./node_modules/vue-style-loader!./node_modules/css-loader?{"sourceMap":true}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-346945b4","scoped":true,"hasInlineConfig":false}!./node_modules/sass-loader/lib/loader.js?{"indentedSyntax":true,"sourceMap":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/components/braTab.vue 4:14-397 13:3-17:5 14:22-405
 @ ./src/components/braTab.vue
 @ ./src/router/index.js
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js



 WAIT  Compiling...                                                                                                                   14:22:48

 94% asset optimization

 ERROR  Failed to compile with 1 errors                                                                                               14:22:48

 error  in ./src/components/braTab.vue

Module build failed:
undefined
        ^
      Invalid CSS after ".tabMain{": expected "}", was "{}"
      in D:\wYcom\braTab\src\components\braTab.vue (line 61, column 10)

 @ ./node_modules/vue-style-loader!./node_modules/css-loader?{"sourceMap":true}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-346945b4","scoped":true,"hasInlineConfig":false}!./node_modules/sass-loader/lib/loader.js?{"indentedSyntax":true,"sourceMap":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/components/braTab.vue 4:14-397 13:3-17:5 14:22-405
 @ ./src/components/braTab.vue
 @ ./src/router/index.js
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js