标签: react-static

我正在尝试为包含 tailwindcss v1 和 postcss-import 的 react-static 站点设置启动器。我无法通过构建或启动进程来解析 @import "tailwindcss/xxx" 指令。我用 tailwindcss v0.7.4 得到相同的结果

这就是我所做的......

1. react-static create选择basic选项
2. yarn add tailwindcss@next
3. yarn add postcss-import
4. yarn tailwind init
5. 添加 postcss.config.js
6. src/app.css用 3 个@import语句替换了内容

我尝试了许多选项，例如从其他现有项目开始，更改@import参数。例如"../tailwindcss，"src/tailwindcss，"../src/tailwindcss等

基本上我没有做任何改变错误，只是无法解析的文件名。

但是，还有 2 个可能相关的额外观察结果。首先，安装 tailwind 并npx tailwind build src/styles.css -o src/app.css从styles.css.

其次， postcss-import 根本没有发生 - 改变它对结果没有影响。

// tailwind.config.js
module.exports = {
  theme: {},
  variants: {},
  plugins: []
}

// postcss.config.js …

我们有一个大型且复杂的传统 React 应用程序，我们在过去几年中一直在构建它。它加载一个index.html，注入javascript并像往常一样从API获取数据。不幸的是，冷加载时间非常糟糕（平均 5 - 7 秒）。一旦所有内容加载完毕，它会像往常一样快速，但冷加载时间会在特定的“关键”页面中杀死我们。这些是我们的公共用户页面，格式为：https://mywebsite/userId

我们正在寻找一种方法来显着加快这些路线的加载时间，其方法超越代码分割或资源优化。我们已经做到了这些，并且正在通过 CDN 提供我们的应用程序。

我们研究了创建这些用户页面的静态“快照”，我们需要使用像react-static这样的东西快速加载，并将它们作为静态版本提供并稍后进行水化。使用 next.js 或 gatsby 之类的东西重写我们的项目不是一个选择，因为它需要太多的工作。SSR 也不是一个选项，因为我们的整个后端都是用 Django 而不是 Node.js 编码的

我们走在正确的轨道上吗？是否可能/值得使用react-static（或类似的工具）来做到这一点？有很多关于如何从头开始创建反应静态项目的文档，但没有关于如何转换现有项目的文档，即使它只是我们需要的一小部分路由。

此外，一旦用户页面上的数据发生变化，我们如何触发适当快照的“重建”？用户更新数据的频率并不高，大约每月 4 次或 3 次，但我们有 3000 名用户，因此平均每小时更新 15 次可能是正常的。我们可以只触发实际更改的路由的重建吗？

我在 React 应用程序中使用 react-snap 包，它基本上可以生成整个应用程序的静态形式。但它实际上会抓取所有 AJAX 数据并获取它们，然后构建静态站点。但我希望 react-snap 跳过一些 AJAX 请求。我希望我的应用程序在客户端打开静态页面时发出这些请求。