在Vue项目中如何解决GEThttp://localhost:8080/js/chunk-vendors.js404错误？

Vue项目运行时报错GET http://localhost:8080/js/chunk-vendors.js 404？本文针对Vue项目中常见的chunk-vendors.js 404错误，深入分析了其原因，主要包括`vue.config.js`中的`publicPath`配置错误和服务器MIME类型设置错误（例如将.js文件错误地设置为text/html）。文章提供了解决方案：检查`publicPath`配置是否与部署路径一致，以及检查服务器是否正确配置了.js文件的MIME类型为`application/javascript`，确保资源能够正确加载和执行。 通过本文，您可以快速排查并解决此类问题，顺利运行您的Vue项目。

Vue项目中解决GET http://localhost:8080/js/chunk-vendors.js 404错误

在Vue项目开发中，经常会遇到浏览器无法加载资源，例如出现GET http://localhost:8080/js/chunk-vendors.js 404 (Not Found) 或 Refused to execute script from 'http://localhost:8080/js/chunk-vendors.js' because its MIME type ('text/html') is not executable 错误。这些错误提示chunk-vendors.js文件找不到，或MIME类型错误导致脚本无法执行。

即使直接访问http://localhost:8080/js/chunk-vendors.js能获取到资源，问题依然存在。这通常是由于资源路径配置或服务器MIME类型设置不正确导致的。

你的vue.config.js文件配置如下：

const CompressionWebpackPlugin = require('compression-webpack-plugin');
const { transformElementScss } = require('ele-admin/lib/utils/dynamic-theme');

module.exports = {
  productionSourceMap: false,
  configureWebpack: {
    performance: {
      maxAssetSize: 2000000,
      maxEntrypointSize: 2000000
    }
  },
  chainWebpack(config) {
    config.plugins.delete('prefetch');
    if (process.env.NODE_ENV !== 'development') {
      config.plugin('compressionPlugin').use(
        new CompressionWebpackPlugin({
          test: /\.(js|css|html)$/,
          threshold: 10240
        })
      );
    }
  },
  css: {
    loaderOptions: {
      sass: {
        sassOptions: {
          outputStyle: 'expanded',
          importer: transformElementScss()
        }
      }
    }
  }
};

问题可能出在以下两个方面：

1. publicPath配置: 确保vue.config.js中publicPath配置正确，它决定了静态资源的访问路径。 默认情况下，publicPath为/，这在大多数情况下是正确的。但如果你的项目部署在子目录下，则需要修改此配置。

2. 服务器MIME类型: 服务器必须正确设置.js文件的MIME类型为application/javascript。错误的MIME类型（例如text/html）会导致浏览器无法正确解析和执行JavaScript文件。

解决方法：

1. 检查publicPath: 检查vue.config.js，确认publicPath设置是否正确。如果你的项目部署在/my-app目录下，则需要将publicPath设置为/my-app/。

2. 检查服务器配置: 检查你的服务器（例如Nginx或Apache）配置，确保.js文件的MIME类型正确设置。

通过以上步骤，你应该能够解决GET http://localhost:8080/js/chunk-vendors.js 404错误，并成功运行你的Vue项目。 如果问题仍然存在，请检查你的项目构建过程和服务器日志，以获取更多信息。

以上就是本文的全部内容了，是否有顺利帮助你解决问题？若是能给你带来学习上的帮助，请大家多多支持golang学习网！更多关于文章的相关知识，也可关注golang学习网公众号。