React 组件 html 开发期间预览
React component html preview during development
我在 github 上找到了一个通用的开源 React 组件，我想修改它并在我自己的 React 项目中使用它。该组件位于使用 rollup 作为捆绑器的项目中。这是一个非常简单的组件，只有一个文件 src/index.tsx。项目中包含 rollup.config.js 和 tsconfig.json.
我更愿意 fork 项目并修改它自己的存储库并将其包含在我的项目中，而不是仅仅将代码复制到我的项目中。
为了修改组件，我希望在进行更改时能够在 html 页面中看到它，就像我在处理 create-react-app 项目时那样。
在仅包含组件的 React 项目中工作时，典型的开发工作流程是什么？我如何才能预览更改？
我尝试将另一个 React 应用程序作为组件项目中的子项目并导入父项目的捆绑输出，尽管它编译成功给了我 this error，（我怀疑这个问题重复反应）。
发布我的解决方案以防对任何人有帮助。
我想做的是直观地看到我对反应组件所做的更改。 Storybook 对此非常有用，但如果组件是汇总包的 github 分支，这可能会有用。
我最终做的是克隆库并将其本地导入到我的 React 项目中。例如，如果我的 React 项目是 projects/react-app 而我的组件是 component-project，在 projects/react-app 运行 npm install ../component-project.
然后我将这两个项目链接到全球版本的 React。这是必要的，因此反应应用程序和组件包在开发过程中使用相同版本的反应。否则你会在尝试使用钩子时遇到奇怪的错误。
我按照以下步骤解决了这个问题 :
1. In Your Application:
a) cd node_modules/react && npm link
b) cd node_modules/react-dom && npm link
2. In Your Library
a) npm link react
b) npm link react-dom
从那里你可以启动你的开发服务器并观察汇总的变化，并在你在 React 组件库中进行更改时查看你的更改。做出我想要的更改后，我将库发布到 github 包以继续在我的 CD 工作流程中使用。
我在 github 上找到了一个通用的开源 React 组件，我想修改它并在我自己的 React 项目中使用它。该组件位于使用 rollup 作为捆绑器的项目中。这是一个非常简单的组件，只有一个文件 src/index.tsx。项目中包含 rollup.config.js 和 tsconfig.json.
我更愿意 fork 项目并修改它自己的存储库并将其包含在我的项目中，而不是仅仅将代码复制到我的项目中。
为了修改组件，我希望在进行更改时能够在 html 页面中看到它，就像我在处理 create-react-app 项目时那样。
在仅包含组件的 React 项目中工作时，典型的开发工作流程是什么？我如何才能预览更改？
我尝试将另一个 React 应用程序作为组件项目中的子项目并导入父项目的捆绑输出，尽管它编译成功给了我 this error，（我怀疑这个问题重复反应）。
发布我的解决方案以防对任何人有帮助。
我想做的是直观地看到我对反应组件所做的更改。 Storybook 对此非常有用，但如果组件是汇总包的 github 分支，这可能会有用。
我最终做的是克隆库并将其本地导入到我的 React 项目中。例如，如果我的 React 项目是 projects/react-app 而我的组件是 component-project，在 projects/react-app 运行 npm install ../component-project.
然后我将这两个项目链接到全球版本的 React。这是必要的，因此反应应用程序和组件包在开发过程中使用相同版本的反应。否则你会在尝试使用钩子时遇到奇怪的错误。
我按照以下步骤解决了这个问题
1. In Your Application:
a) cd node_modules/react && npm link
b) cd node_modules/react-dom && npm link
2. In Your Library
a) npm link react
b) npm link react-dom
从那里你可以启动你的开发服务器并观察汇总的变化，并在你在 React 组件库中进行更改时查看你的更改。做出我想要的更改后，我将库发布到 github 包以继续在我的 CD 工作流程中使用。