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

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项目。 如果问题仍然存在，请检查你的项目构建过程和服务器日志，以获取更多信息。

以上就是在Vue项目中如何解决GET http://localhost:8080/js/chunk-vendors.js 404错误？的详细内容，更多请关注php中文网其它相关文章！