使用create-react-app创建库

时间:2016-09-25 08:04:53

标签: javascript reactjs create-react-app

我正在尝试创建一个React-Redux库,我正在尝试使用create-react-app来获取样板代码,但它在构建脚本中包含了与appHtml无关的内容。

有没有办法将弹出的create-react-app转换为库 - 具体来说我需要将所有js文件打包成一个,而只是将它们传递给babel并为每个React生成单独的文件成分

4 个答案:

答案 0 :(得分:9)

我已经设法构建库而不会弹出并使用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

这将编译从srclib目录的所有源,并简单地复制其余文件。不要忘记在package.json中声明主文件(例如"main"="lib/index.js")。

然而,有一点需要注意。如果您使用的文件无法用babel编译(例如css或fonts),那么您图书馆的用户需要设置适当的(webpack)加载器。

答案 1 :(得分:2)

这是迄今为止我发现的最好的...库创建反应应用程序https://github.com/Rubbby/create-react-library

答案 2 :(得分:1)

package.json

中修改以下内容
  1. name
  2. description
  3. scripts
  4. author
  5. license
  6. gitRepository
  7. 并做npm publish。它会在npm

    中发布您的图书馆

答案 3 :(得分:0)

也许您可以使用js-library-boilerplate引导您的项目。 我已经使用了几次,它足以尝试一下。它可以用作vanila js库或react库的基础(在后台使用CRA)。

要使用它,您需要:

  • 克隆存储库
  • 进行如下更改:


  • 编辑许可文件

  • 编辑package.json信息(这些信息将用于生成构建文件的标题)
  • 编辑库:“。MyLibrary”,其库的导出名称位于./config/webpack.config.js中
  • 编辑./bin/postinstall(如果您想在软件包安装时显示一条消息)

...然后您就可以出发了。 此外,所有配置都是打开的,因此您可以根据需要进行调整。 祝你好运!