迁移到 Vue3 时语法错误：类型错误：无法读取未定义的属性（读取“样式”）

Question

我目前正在尝试使用迁移构建从 Vue2 迁移到 Vue3。 当我尝试构建项目时，出现以下错误：

语法错误：类型错误：无法读取未定义的属性（读取“样式”）

以下内容来自我项目的package.json文件：

"dependencies": {
    "@game-streaming/game-streaming-vue-body-class-configure": "*",
    "@vue/compat": "^3.1.0",
    "vue": "^3.1.0",
    "vue-loader": "^16.0.0"
  },
  "devDependencies": {
    "@game-streaming/eslint-config-game-streaming": "*",
    "@types/node": "^17.0.17",
    "@vue/cli-plugin-eslint": "~5.0.0",
    "@vue/cli-plugin-typescript": "~5.0.0",
    "@vue/cli-service": "~5.0.0",
    "@vue/compiler-sfc": "^3.5.12",
    "@vue/eslint-config-typescript": "^9.1.0",
    "eslint-plugin-vue": "^9.9.0",
    "ts-node": "^10.9.1",
    "typescript": "~4.5.5"
  },

和我的 vue.config.js：

module.exports = {
  configureWebpack: {
    resolve: {
      alias: {
        // eslint-disable-next-line global-require,@typescript-eslint/no-var-requires
        '@': require('path').join(__dirname, 'src'),
      },
    },
    module: {
      rules: [
        {
          test: /\.vue$/,
          use: 'vue-loader',
        },
      ],
    },
  },
  chainWebpack: (config) => {
    config.resolve.alias.set('vue', '@vue/compat');
    config.module
      .rule('vue')
      .use('vue-loader')
      .tap((options) => ({
        ...options,
        compilerOptions: {
          compatConfig: {
            MODE: 3,
          },
        },
      }));
  },
};

经过一些研究，我假设它与使用过时的 vue-loader 库有关（尽管不确定。）非常感谢帮助！

我尝试使用 vue-loader v.16

Answer 1

这是因为 vue-template-compiler。我弄清楚是什么依赖关系导致它被拉入项目并将其删除。

npm list vue-template-compiler