构建项目 React 时找不到本地 CSS 和 JS答案

【问题标题】：local CSS and JS not found when building project React构建项目 React 时找不到本地 CSS 和 JS
【发布时间】：2020-07-13 17:17:00
【问题描述】：

我安装了 bootstrap、jquery .... npm 使用了他们来自 node_modules 的路径，它作为开发工作，但是当我使用“npm run build”构建项目时，所有的 css 都丢失了，我可以在开发人员工具中看到'network'，css文件的路径是node_modules....构建文件夹中不存在。

除了手动复制/粘贴到构建文件夹之外，还有其他方法可以将这些文件导入，

我无法使用 CDN。该应用将无法在互联网上使用。

如果有不清楚的地方，请发表评论。谢谢

【问题讨论】：

这个问题的概念很常见而且很清楚..但你没有告诉我们很多事情：你在使用 create-react-app 吗？你在使用另一个模板吗？你在哪里导入这些模块（引导程序，...）或者你只是安装它们？
听起来您将它们包含在 html 中，而不是在您的 jsx 文件中导入 import './path/to/file.css'
更新：我确实导入了它们，当我构建项目并使用 serve -s build 提供服务时，它运行正常，但使用 nginx 仍然没有 css
@AbdennourTOUMI 不，我没有使用 create-react-app，我使用 npm 完成了所有工作

标签： javascript css reactjs deployment build

【解决方案1】：

您是否将 CSS 包含在您的反应文件中作为 `import "./path/to/example.css" 在反应文件的导入部分？这将使 webpack 将 CSS 与您的应用程序捆绑在一起

【讨论】：

更新：我确实导入了它们，当我构建项目并使用 serve -s build 提供服务时，它运行正常，但使用 nginx 仍然没有 css
那么当您通过 nginx 提供构建文件夹时，您会遇到什么错误？
没有错误，它不提供 css，我什至尝试在 build 文件夹中添加一个 css 文件夹，但 nginx 没有提供它

【解决方案2】：

当我将 node_modules 用于样式和脚本时，我使用 scss 并将带有路径的 @import 添加到 node_modules 中，对于脚本添加带有指向 node_modules 的路径的 import。

SCSS

@import "~bootstrap";

import 'jquery'

【讨论】：