使用 create-react-app 创建库答案

【问题标题】：Using create-react-app to create a library使用 create-react-app 创建库
【发布时间】：2016-09-25 08:04:52
【问题描述】：

我正在尝试创建一个 React-Redux 库，并且我正在尝试使用 create-react-app 来获取样板代码，但它在构建脚本中包含了一些不相关的内容，例如 appHtml。

有没有办法将弹出的 create-react-app 转换为库 - 特别是我需要不将所有 js 文件打包成一个，而是只需通过 babel 传递它们并为每个 React 生成单独的文件组件？

【问题讨论】：

【解决方案1】：

我已经设法在不弹出和使用 create react app 的内部依赖项的情况下构建库。我已经用react-scripts@0.9.5 对其进行了测试。首先需要安装babel-cli:

npm install --save-dev babel-cli

创建.babelrc 包含内容的文件：

{
  "presets": ["react-app"]
}

然后将脚本添加到package.json:

"compile": "NODE_ENV=production babel src --out-dir lib --copy-files",

最后运行：

npm run compile

这将编译从src 到lib 目录的所有源代码并简单地复制剩余的文件。不要忘记在package.json 中声明主文件（例如"main"="lib/index.js"）。

但是有一个警告。如果您使用的文件不能用 babel 编译（例如 css 或字体），那么您的库的用户需要设置适当的（webpack）加载器。

【讨论】：

对于当前的 react-scripts@2.1.3（使用 Babel 7）而不是 babel-cli 安装 @babel/cli 和 @babel/preset-react
如果您使用的是 Windows，则需要添加 cross-env 才能使上述编译命令正常工作：npm install --save-dev cross-env，"compile": "cross-env NODE_ENV=production babel src --out-dir lib --copy-files",
直接用 babel 创建项目会更容易，还是在这种情况下 create-react-app 仍然为你做很多事情？

【解决方案2】：

在package.json中编辑以下内容

然后做npm publish。它将在npm 中发布您的库

【讨论】：

【解决方案3】：

这是迄今为止我发现的最好的..使用 create-react-app 库 https://github.com/Rubbby/create-react-library

【讨论】：

【解决方案4】：

也许您可以使用js-library-boilerplate 引导您的项目。我已经用过好几次了，试一试就足够了。它可以用作 vanila js 库或反应库的基础（在引擎盖下使用 CRA）。

要使用它，您需要的是：

...你准备好了。此外，所有配置都是打开的，因此您可以根据需要进行调整。祝你好运！

【讨论】：