reactjs - React webpack 应用程序 public/images 与 src/images

标签 reactjs webpack assets directory-structure organization

我还使用 webpack 进行转译并捆绑到公共(public)环境中。
公开与非公开保留图像 Assets 有何优缺点。
哪种项目结构更适合 React 应用程序?

public/  
-images/  
--favicon.ico  
--(other-image-files...)  
-index.html
-bundle.js

src/
-components/
-style/
-images/
-utils/

最佳答案

src目录具有源代码被编译、链接并最终成为可执行文件的悠久历史。考虑到当今的构建工具,这个概念仍然是当前的。与webpack , brunch ,或parcel ,你从来没有真正直接从public“提供”任何东西。目录 - 所有内容都被转译、捆绑等到 public 中或dist输出目录。

考虑到这一点,我会提交 src完全适合图像,甚至您的 index.html文件(请注意,最终出现在分发文件夹中的 index.html 可能与您创建的原始“源”index.html 不同)。我希望这有帮助。不确定它是否更好,但针对您的问题,我将其作为一种观点。

关于reactjs - React webpack 应用程序 public/images 与 src/images,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49433651/

相关文章:

reactjs - 尝试在类里面进行获取

javascript - 如何在不不断重新安装的情况下将包装组件传递到 React Router

node.js - html-webpack-plugin - 如何在不执行 EJS 模板的情况下插入 webpack bundle.js

javascript - 如何解析自定义 webpack 加载器中的 require 字符串

ruby-on-rails - rails : Couldn't find a file for 'twitter/bootstrap'

ruby-on-rails - rails Assets :precompile during slug for s3 error: Fog provider and directory can't be blank when env are set

javascript - React 如何有条件地覆盖 Material-UI 中的 TextField 错误颜色?

javascript - 将指针快速移出窗口时,元素保持悬停状态

javascript - ESLint/VS代码。在 VSCode 中打开新项目后,Eslint 扩展没有检查任何内容

Flutter:未处理的异常:无法加载 Assets