Question

我遇到问题我无法找到之前的任何答案或文档。

我在模块中加载组件，在我的本地计算机上，＆＃34; login.jsx，＆＃34;进入＆＃34; index.js＆＃34;：

import Login from './login';

export { Login };

导出的组件＆＃34; login.jsx＆＃34;是非常基本的。

模块main直接指向index.js文件，我将其导入到＆＃34; App.js＆＃34; create-react-app生成的文件。

模块的目录结构如下：

module
   | src
   | --- components
   | --- --- login.jsx
   | --- --- index.js
   | package.json

值得注意的是，这也是一个create-react-app，但生成的文件都不是链接模块主要导出的一部分。

当我导入它和console.log时，它将作为字符串导入：＆＃34; /static/media/login.1d0b2e37.jsx。＆＃34;

具体来说，我得到的错误是：

Invalid tag: /static/media/login.1d0b2e37.jsx

因为我试图加载导入：

import { Login } from 'component-module';

直接进入react-router-dom路由。直接存在于create-react-app文件夹中的所有组件，＆＃34; src，＆＃34;渲染得很好。

记录时：

console.log(Login);

导入后，立即清楚它是一个字符串：＆＃34; /static/media/login.1d0b2e37.jsx。＆＃34;

我的create-react-app项目的目录结构是（通用的create-react-app）：

create-react-app
   | src
   | --- App.js

其中存在上述导入，导致将Login作为字符串导入。

创建反应应用程序开发服务器渲染外部组件是否存在一些奇怪的问题？也许在一个只是将外部处理为静态的Webpack插件中？

中没有相关信息

Answer 1

按模块，你的意思是图书馆吗？在某些东西中你可以通过npm install安装为其他应用程序的依赖项吗？

如果是这样，CRA不是为此目的而设计的。它旨在创建应用程序。

如果您确实需要为登录组件创建库，并希望使用CRA这样做，则可以按照本指南进行操作：https://medium.com/@lokhmakov/best-way-to-create-npm-packages-with-create-react-app-b24dd449c354或使用this tool，尽管我从未尝试过我自己也不能担保它。

是否有充分的理由将组件实现为库？库主要用于与开发人员共享通用功能，以便在各自的应用程序中使用。

如果您只打算在特定应用中使用此组件，我建议您将其作为应用内的组件实施。您仍然可以将其实现为独立库，但无需设置构建逻辑。

width="wrap_content"

中