Express+Typescript+React：错误：ENOENT：没有这样的文件或目录，stat '/app/frontend/build/index.html'？答案

【问题标题】：Express+Typescript+React: Error: ENOENT: no such file or directory, stat '/app/frontend/build/index.html'?Express+Typescript+React：错误：ENOENT：没有这样的文件或目录，stat '/app/frontend/build/index.html'？
【发布时间】：2019-08-22 10:10:49
【问题描述】：

我在ts中有这个快递服务器，这是转换后的js，代码：

class App {
    constructor() {
        this.app = express();
        ...
        this.config();
        ...
    }
    config() {
        if (process.env.NODE_ENV === 'production') {
            // Serve any static files
            this.app.use(express.static(path.join(__dirname, '../../frontend/build')));
            // Handle React routing, return all requests to React app
            this.app.get('*', (req, res) => {
                res.sendFile(path.join(__dirname, '../../frontend/build', 'index.html'));
            });
        }
    }
}
exports.default = new App().app;

但我在 heroku 上收到此错误：

错误：ENOENT：没有这样的文件或目录，stat '/app/frontend/build/index.html'

我检查了 heroku bash 上的目录并在那里构建，这不是我第一次部署应用程序，但这次是打字稿，我习惯了 javascript，我想这可能是不同的？我 100% 确定该文件夹正确地定位在 config() 上。帮忙？

【问题讨论】：

path.join(__dirname, '../../frontend/build') ... 你确定要像这样加入 dirrname 吗？因为你已经在 dirname 中了。为什么要回去？也许 path.join(__dirname, '/frontend/build'

标签： reactjs typescript express

【解决方案1】：

TypeScript 不会将其未主动编译的文件复制到目标目录，例如资产和模板文件。

我怀疑index.html 没有复制到您的代码解析res.sendFile(...) 的绝对路径的输出目录。

您可能希望将这些文件移动到 TypeScript 编译过程未触及的单独目录中。或者，实现 gulp 或 grunt 任务，递归地将所有非 JavaScript、非 JSON 和非 TypeScript 文件复制到 TypeScript 输出文件夹，以便所有相对路径都能正确解析。

这个帖子可能会对你有所帮助：Angular 2 + Typescript compiler copy html and css files

【讨论】：