vue3 使用外部reset.less嵌套部分样式无效

默默前进的小白

因为有很多地方样式通用，于是提取出样式到reset.less中，在app.vue中引用



到页面上发现。reset.less是被引用了没错，但是第二层中的样式没有生效，简单来说就是less文件等于css文件了，嵌套的子元素样式识别不到。
刚开始是觉得可能我的vue-clli版本不对，去检查

应该也还好，不是什么老古董。去百度吧，好像也没人有我这情况。
最后的解决方法：然后误打误撞的去测试，在main.js中引用就可以生效
说来惭愧，我到现在都不知道为什么有这种情况。。。
默默的问一句，大家有觉得vue3写的时候有些样式或者方法没有实时更新到页面上吗，还需要自己手动去刷新下才可以。。。
难道一定要用vite才能完美的发挥出vue3的实力吗。。。有点小白，不是很理解为啥我写的vue3项目会这样。。。
附上当前出现问题的项目的配置

{
  "name": "XXXXXXXXXX",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build"
  },
  "dependencies": {
    "@element-plus/icons-vue": "^2.0.6",
    "core-js": "^3.8.3",
    "element-plus": "^2.2.12",
    "vue": "^3.2.13",
    "vue-router": "^4.0.3",
    "vuex": "^4.0.0"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~5.0.0",
    "@vue/cli-plugin-router": "~5.0.0",
    "@vue/cli-plugin-vuex": "~5.0.0",
    "@vue/cli-service": "~5.0.0",
    "less": "^4.1.3",
    "less-loader": "^11.0.0",
    "unplugin-auto-import": "^0.11.1",
    "unplugin-vue-components": "^0.22.0"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead",
    "not ie 11"
  ]