当我尝试启动 React 应用程序时，我不断收到“无法加载资源”答案

【问题标题】：I keep getting "Failed to load resource" when I try to start an React app当我尝试启动 React 应用程序时，我不断收到“无法加载资源”
【发布时间】：2018-05-23 05:37:04
【问题描述】：

所以我正在开发一个使用 Webstorm for IDE 的 React 应用程序。据我所知，一切似乎都配置正确，但不知何故，当我尝试运行应用程序时，它会抛出错误“加载资源失败：服务器响应状态为 404（未找到）”。

这是索引中的脚本示例：

<script>
    try {
        Typekit.load({
            async: true
        });
    } catch (e) {}
</script>
<script type="text/javascript" src="app/fonts/Numbers.js"></script>
<script src="/dist/app.bundle.js"></script>

...来自 server.js

const express = require('express');
const path = require('path');
const fs = require('fs');
const bodyParser = require('body-parser');
const app = express();
const renderIndex = function (req, res) {
  console.warn(__dirname + '/app/' + 'index.tpl.html');
  res.sendFile(path.join(__dirname, '/app/', 'index.tpl.html'));
};

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: true}));

app.use(express.static(path.join(__dirname, '/')));



app.listen(3000, function () {
  console.log('Your app listening on port 3000!')

<p>
0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/bin/node',
1 verbose cli   '/usr/local/lib/node_modules/npm/bin/npm-cli.js',
1 verbose cli   'run',
1 verbose cli   'start',
1 verbose cli   '--scripts-prepend-node-path=auto' ]
2 info using npm@5.5.1
3 info using node@v9.2.0
4 verbose run-script [ 'prestart', 'start', 'poststart' ]
5 info lifecycle webpack-react-redux@1.0.0~prestart: webpack-react-redux@1.0.0
6 info lifecycle webpack-react-redux@1.0.0~start: webpack-react-redux@1.0.0
7 verbose lifecycle webpack-react-redux@1.0.0~start: unsafe-perm in lifecycle true
8 verbose lifecycle webpack-react-redux@1.0.0~start: PATH: /usr/local/lib/node_modules/npm/bin/node-gyp-bin:/Users/blkbox/Desktop/Chris'/Quantdir/quantum-express-server/node_modules/.bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/opt/X11/bin
9 verbose lifecycle webpack-react-redux@1.0.0~start: CWD: /Users/blkbox/Desktop/Chris'/Quantdir/quantum-express-server
10 silly lifecycle webpack-react-redux@1.0.0~start: Args: [ '-c', 'node server' ]
11 silly lifecycle webpack-react-redux@1.0.0~start: Returned: code: 1  signal: null
12 info lifecycle webpack-react-redux@1.0.0~start: Failed to exec start script
13 verbose stack Error: webpack-react-redux@1.0.0 start: `node server`
13 verbose stack Exit status 1
13 verbose stack     at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:280:16)
13 verbose stack     at EventEmitter.emit (events.js:159:13)
13 verbose stack     at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
13 verbose stack     at ChildProcess.emit (events.js:159:13)
13 verbose stack     at maybeClose (internal/child_process.js:943:16)
13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:220:5)
14 verbose pkgid webpack-react-redux@1.0.0
15 verbose cwd /Users/blkbox/Desktop/Chris'/Quantdir/quantum-express-server
16 verbose Darwin 14.5.0
17 verbose argv "/usr/local/bin/node" "/usr/local/lib/node_modules/npm/bin/npm-cli.js" "run" "start" "--scripts-prepend-node-path=auto"
18 verbose node v9.2.0
19 verbose npm  v5.5.1
</p>

我想要完成的是让应用程序在浏览器中运行，但继续出现错误。非常感谢您的回复。谢谢。

【问题讨论】：

标签： javascript node.js reactjs react-redux

【解决方案1】：

您是否尝试过从路径中删除第一个正斜杠 src='dist/app.bundle.js'

【讨论】：

【解决方案2】：

您能否确认入口点路径确实正确？ "/dist/app.bundle.js"

【讨论】：

是的，入口点设置在这里：module.exports = { entry: { app: './app/index.js' }, target: 'node', output: { path: path.resolve(__dirname, './dist'), 文件名: '[name].bundle.js', },

【解决方案3】：

也许您可以添加服务器路由 /，它会返回您的索引 html

app.get('/',function (req, res) { res.sendFile(pathToYourHTML) })

【讨论】：