It is configured according to the online tutorial, but it still reports errors. The error information is as follows:

Module build failed (from ./node_modules/sass-loader/dist/cjs.js):

    width: $sideBarWidth !important;
          ^
      Undefined variable: "$sideBarWidth".

Baidu has a problem with the version of SASS loader
// in sass version 9, additionaldata is used, in sass version 8, prependdata is used, and in other versions, data
my version is 7.1.0, so finally changing the key name to data solves the problem

in vue.config.js, the configuration is as follows:

module.exports = {
    ...
	css: {
	  //   extract: true // Whether to use the css separation plugin ExtractTextPlugin (open skeleton screen must be this configuration)
	    // css presetter configuration item
	    // use additionalData in sass version 9 use prependData in version 8, other versions, use data
	    // semicolon here; required
	    loaderOptions: {
	      sass: {
	        data: '@import "./src/styles/variables.scss";'
	      }
	    },
	  },
	 ...
},

Note: semicolon after the configuration file path; Media query expression must begin with ‘(‘