除了Windows上的主页之外，带有Node后端的Vue应用程序不会呈现任何内容，它在生产中和MacOS本地主机上都能工作

Question

该应用程序在生产中已经成功运行了一年，并且在MacOS本地主机上运行得很好。最近需要设置该应用程序以在Windows 10本地主机上运行，在解决了所有错误后，现在应用程序启动，请求似乎通过，但是，只有'/‘页面实际上呈现，所有其他路由不呈现和停留在一个空白页。

有什么理由？

在最初的安装过程中，我遇到了windows构建工具和一个缺少的Python的问题，我最终通过巧克力安装了所有的东西，最终解决了这个问题。这可能是相关的吗？

Windows上的节点版本比项目中指定的节点版本更新，这会导致这种情况吗？

我很高兴提供更多的细节，并做任何实验，你们中的任何一个推荐或建议。我自己的猜测是，这要么与Windows上的安装有关，要么与Windows上的包有关。

该应用程序是通过package.json启动脚本启动的：

"scripts": {
  "dev": "run-p dev:server dev:client",
  "dev:server": "nodemon --ignore './client' app.js",
  "dev:client": "cd client && npm run serve",
  "postinstall": "npm install --only=dev --prefix client && npm install --prefix client && npm run build --prefix client",
  "start": "node app.js",
  "heroku-prebuild": "python cleanup_script.py"
},

vue应用程序包含将因此执行的以下脚本：

"scripts": {
  "serve": "vue-cli-service serve",
  "build": "vue-cli-service build",
  "lint": "vue-cli-service lint",
  "bundle-report": "webpack-bundle-analyzer --port 4200 dist/stats.json"
},

VueJS package.json依赖项和dev依赖项。

{
"version": "0.1.0",
"private": true,
"scripts": {
  "serve": "vue-cli-service serve",
  "build": "vue-cli-service build",
  "lint": "vue-cli-service lint",
  "bundle-report": "webpack-bundle-analyzer --port 4200 dist/stats.json"
},
"dependencies": {
  "@ckeditor/ckeditor5-build-decoupled-document": "^18.0.0",
  "@ckeditor/ckeditor5-vue": "^1.0.3",
  "@johmun/vue-tags-input": "^2.1.0",
  "@vue/composition-api": "^1.0.0-rc.3",
  "autolinker": "^3.14.2",
  "axios": "^0.21.1",
  "core-js": "^3.8.2",
  "date-fns": "^2.16.1",
  "detectrtc": "^1.4.1",
  "gsap": "^3.6.0",
  "imagekitio-vue": "^1.0.9",
  "ismobilejs": "^1.1.1",
  "jwt-decode": "^2.2.0",
  "maxlength-contenteditable": "^1.0.1",
  "socket.io-client": "^3.1.2",
  "twilio-video": "^2.10.0",
  "v-hotkey": "^0.8.0",
  "vue": "^2.6.12",
  "vue-color": "^2.8.1",
  "vue-gtag": "^1.16.1",
  "vue-i18n": "^8.22.4",
  "vue-infinite-loading": "^2.4.5",
  "vue-router": "^3.4.9",
  "vue-select": "^3.11.2",
  "vue-smooth-dnd": "^0.8.1",
  "vue-vimeo-player": "^0.2.2",
  "vue-window-size": "^1.0.3",
  "vue-youtube": "^1.4.0",
  "vuejs-datepicker": "^1.6.2",
  "vuex": "^3.6.0",
  "webrtc-adapter-test": "^0.2.10"
},
"devDependencies": {
  "@vue/cli-plugin-babel": "~4.3.0",
  "@vue/cli-plugin-eslint": "~4.3.0",
  "@vue/cli-service": "~4.3.0",
  "babel-eslint": "^10.1.0",
  "dotenv-webpack": "^5.1.0",
  "eslint": "^6.7.2",
  "eslint-plugin-vue": "^6.2.2",
  "vue-template-compiler": "^2.6.12",
  "webpack-bundle-analyzer": "^4.4.0"
},
"eslintConfig": {
  "root": true,
  "env": {
    "node": true
  },
  "extends": [
    "plugin:vue/essential",
    "eslint:recommended"
  ],
  "parserOptions": {
    "parser": "babel-eslint"
  },
  "rules": {}
},
"browserslist": [
  "> 1%",
  "last 2 versions",
  "not dead"
]

Answer 1

节点版本可能是一个问题。安装所需的windows-build工具表明存在与当前Node版本可能不兼容的二进制依赖关系。二进制NPM依赖项通常为特定的包版本提供预编译二进制文件的子集，其中平台和Node.js版本的组合可以被认为是安全的或受支持的。对于任何其他组合，都需要使用构建工具为当前平台编译二进制包。这并不总是意味着包是不兼容的，但这是常见的。

例如，node-sass (这里似乎没有使用)有不同的版本，它们对应于特定的Node.js版本，并为受支持的子集提供预编译二进制文件；对于不受支持的Node.js版本，则在安装过程中返回编译，并且很可能失败。

在这种情况下，还不知道是哪些依赖关系导致了这个问题，需要在npm/纱线日志中对此进行检查。

为了避免这种情况，节点版本可以与旧版本进行匹配。需要新安装项目依赖项，因为使用中的node_modules已经绑定到当前使用的Node版本。