1

これは、ビルド ツールのアップグレードを先延ばしにするもう 1 つのケースです。アップグレードするたびに、対処しなければならない変更が大量にあるからです。

vue cli 4.5 を使用して新しいプロジェクトを作成し、新しいプロジェクトと同じようにロードしました。次に、依存関係、構成ファイルなどに関する限り、新しいプロジェクトがどのように見えるかを複製しました。node_modulesを削除し、パッケージロックを削除し、実行npm installしnpm run serveてから、Web全体で見られる奇妙なキャッシュエラーを取得しましたが、何もうまくいきませんでした.

この依存関係は見つかりませんでした:

@/components/renderers/Loader in ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/ cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/grids/shared.vue?vue&type=script&lang=js&

インストールするには、次を実行します: npm install --save @/components/renderers/Loader

これらの関連モジュールが見つかりませんでした:

./src/components/icons/index.js の ./Icon.vue

../../renderers/Loader in ./node_modules/cache-loader/dist/cjs.js??ref--12-

などなど

これが私のpackage.jsonです

{ 
  "name": "myapp",
  "description": "A Vue.js project",
  "version": "1.0.0",
  "author": "Me",
  "license": "MIT",
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "core-js": "^3.6.5",
    "vue": "^2.6.11",
    "vue-router": "^3.3.0",
    "vuex": "^3.4.0",
    "sass-loader": "^9.0.3"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "vue-template-compiler": "^2.6.11"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "parserOptions": {
      "parser": "babel-eslint"
    },
    "rules": {}
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead"
  ]
}

ここに私の vue.config.js があります

module.exports = {


  publicPath: process.env.NODE_ENV === 'production' ? '/AppFolder/dist/' : 'http://localhost:8080/dist/',
  runtimeCompiler: true,  
  css: {
    // Enable CSS source maps.
    sourceMap: process.env.NODE_ENV !== 'production'
  },
  devServer: {
    headers: { "Access-Control-Allow-Origin": "*" },
    port: 8080,
    disableHostCheck: true,
    overlay: {
      warnings: true,
      errors: true
    }
  }
}

次に、vue.config.jsを削除しようとしました...

そしてbabel.config.js

module.exports = {
  presets: [
    '@vue/cli-plugin-babel/preset'
  ]
}

以前はすべてが完全に正常に機能していました。すぐに使用できるアプリには、相対またはエイリアス (つまり @) に関する問題はありません。

ここで少し混乱！

4

1 に答える 1

0

問題を解決するために何時間も費やした後、SOに投稿した後に答えを見つけたようです。

方法や理由はわかりませんが、私の IDE (Visual Studio) では、ケーシングが実際のファイル システムとは異なっていました。IDEを介してファイルを作成したので、誰が知っていますか。

ここで、この重大な変更を追跡しようとします。したがって、似たような問題に遭遇した人は、実際のフォルダー内のファイル名が正確に一致していることを確認してください。

于 2020-08-21T20:29:43.763 に答える