如何调试 404 发布节点站点到 Github 页面？

Question

我正在将基于 React Slingshot 样板的编译节点站点部署到 Github Pages。通过 npm start 在本地运行就可以了。

但是当我使用 babel 编译文件并提交到我的 github 页面存储库时。该站点为main.c5ec540e041525c6d312.js 文件返回了 404，尽管我可以看到它在 git 存储库中。 （从链接提交的公司名称，因此这些在下面不起作用）

从 Github 创建的链接是：

https://pages.github.mycompanyname.com/DDM/index.html

我得到的 404 是：

https://pages.github.mycompanyname.com/main.c5ec540e041525c6d312.js/

我确实尝试按照此处的建议删除并重新添加存储库，但无济于事：

How to fix page 404 on Github Page?

问题： 如何将 404 发布节点站点调试到 Github 页面？

这是babel编译后dist文件夹的内容。然后我将其推送到 Github Pages 存储库，该存储库从主分支自动构建网站。但是在 main.js 文件上给出了 404：

我确实尝试在编译之前将 Index.js 中的 browserHistory 更改为 hashHistory。正如 github 页面上的问题所述，browserHistory 使用绝对链接，而后者没有：

import React from 'react';
import ReactDom from 'react-dom';
import Routes from './routes';
import {Router, hashHistory} from 'react-router';
import './styles/styles.scss';


import appStore from './reducers';
import { Provider } from 'react-redux';
import { createStore } from 'redux';

let store = createStore(appStore);

require('./images/favicon.ico');
let element = document.getElementById('app');

ReactDom.render(
  <Provider store={store}>
        <Router history={hashHistory} routes={Routes.routes} />
    </Provider>, element);

document.body.classList.remove('loading');

这是编译后的 index.js 文件的链接：

http://hastebin.com/sipimizazu.xml

同时查看 webpack pro 配置以进行编译。我看到公共路径设置如下：

export default {
  resolve: {
    extensions: ['', '.js', '.jsx']
  },
  debug: true,
  devtool: 'source-map', // more info:https://webpack.github.io/docs/build-performance.html#sourcemaps and https://webpack.github.io/docs/configuration.html#devtool
  noInfo: true, // set to false to see a list of every file being bundled.
  entry: path.resolve(__dirname, 'src/index'),
  target: 'web', // necessary per https://webpack.github.io/docs/testing.html#compile-and-test
  output: {
    path: path.resolve(__dirname, 'dist'),
    publicPath: '/',
    filename: '[name].[chunkhash].js'
  },

Answer 1

在 webpack 配置中更改 publicPath 修复了 404 错误。因为我的 github 页面位于 .../DDM/

我将配置更新为以下内容：

output: {
    path: path.resolve(__dirname, 'dist'),
    publicPath: '/DDM/',
    filename: '[name].[chunkhash].js'
  },