使用 create-react-app 创建库
Using create-react-app to create a library
我正在尝试创建一个 React-Redux 库,我正在尝试使用 create-react-app 来获取样板代码,但它在构建脚本中包含了无关紧要的内容,例如 appHtml。
有没有办法将弹出的 create-react-app 转换为库 - 具体来说,我需要 不 将所有 js 文件打包成一个,而是将它们通过 babel 传递并生成每个 React 组件的单独文件?
在 package.json
中编辑以下内容
name
description
scripts
author
license
gitRepository
并执行 npm publish
。它会在 npm
中发布您的图书馆
我已经设法在不弹出和使用 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) 加载器。
这是我迄今为止发现的最好的..使用库的 create-react-app https://github.com/Rubbby/create-react-library
也许你可以 bootstrap 你的项目是 js-library-boilerplate。
我已经使用了好几次,它足以让我尝试一下。它可以用作 vanila js 库或 react 库的基础(在引擎盖下使用 CRA)。
要使用它,您需要的是:
- 克隆回购
进行一些更改:
编辑许可证文件
- 编辑 package.json 信息(这些将用于为您的构建文件生成 headers)
- 编辑库:"MyLibrary" 使用您库的导出名称 ./config/webpack。config.js
- 编辑 ./bin/postinstall(如果您想在软件包安装时显示一条消息)
...你准备好了。
此外,所有配置都是开放的,因此您可以根据需要进行调整。
祝你好运!
我正在尝试创建一个 React-Redux 库,我正在尝试使用 create-react-app 来获取样板代码,但它在构建脚本中包含了无关紧要的内容,例如 appHtml。
有没有办法将弹出的 create-react-app 转换为库 - 具体来说,我需要 不 将所有 js 文件打包成一个,而是将它们通过 babel 传递并生成每个 React 组件的单独文件?
在 package.json
name
description
scripts
author
license
gitRepository
并执行 npm publish
。它会在 npm
我已经设法在不弹出和使用 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) 加载器。
这是我迄今为止发现的最好的..使用库的 create-react-app https://github.com/Rubbby/create-react-library
也许你可以 bootstrap 你的项目是 js-library-boilerplate。 我已经使用了好几次,它足以让我尝试一下。它可以用作 vanila js 库或 react 库的基础(在引擎盖下使用 CRA)。
要使用它,您需要的是:
- 克隆回购
进行一些更改:
编辑许可证文件
- 编辑 package.json 信息(这些将用于为您的构建文件生成 headers)
- 编辑库:"MyLibrary" 使用您库的导出名称 ./config/webpack。config.js
- 编辑 ./bin/postinstall(如果您想在软件包安装时显示一条消息)
...你准备好了。 此外,所有配置都是开放的,因此您可以根据需要进行调整。 祝你好运!