[英]How to publish existing CRA application to npm(any) repository?
I have a working application consisting multiple components created using create-react-app, each component is a separate app in itself again created using create-react-app.我有一个由使用 create-react-app 创建的多个组件组成的工作应用程序,每个组件本身都是一个单独的应用程序,再次使用 create-react-app 创建。
All the components are ejected so that I could integrate it together.所有组件都被弹出,以便我可以将它们集成在一起。
Now, I want to publish the components to NPM/Private repository but as per CRA deployment guide, it doesn't support publishing of CRA based components directly out of the box, it suggests using nwb, but I couldn't figure out how to use nwb to publish 'existing' components.现在,我想将组件发布到 NPM/私有存储库,但根据 CRA 部署指南,它不支持直接开箱即用地发布基于 CRA 的组件,它建议使用 nwb,但我不知道如何使用 nwb 发布“现有”组件。
I have also looked at the one of the medium post where it suggests using the babel-cli to generate the dist/build files but that's failing for some babel configuration which works well otherwise.(sorry, don't have link at the moment as I am posting this from cellphone).我还查看了一篇中篇文章,其中建议使用 babel-cli 生成 dist/build 文件,但是对于某些 babel 配置来说失败了,否则效果很好。(抱歉,目前没有链接我是通过手机发布的)。
Any help is appreciated.任何帮助表示赞赏。
You can do it by using babel-cli
npm package which will compile your react application code and then you can publish it using npm publish
command, the detailed steps are as follows.你可以使用
babel-cli
npm 包来编译你的 React 应用程序代码,然后你可以使用npm publish
命令发布它,详细步骤如下。
Install the babel-cli package in your create-react-app using npm install babel-cli
command.使用
npm install babel-cli
命令在 create-react-app 中npm install babel-cli
。
Create .babelrc
file and add following contents to use "react-app" preset provided by babel.创建
.babelrc
文件并添加以下内容以使用 babel 提供的“react-app”预设。
{
"presets": [["react-app"]],
}
distribute
command in package.json
using following code, this command compiles the code from src
folder to dist
folder.package.json
添加distribute
命令,该命令将代码从src
文件夹编译到dist
文件夹。 Generally, I do not include my test files in published library so the --ignore
argument skips the tests files like *spec.js and *test.js
, this argument is optional and you can remove --ignore spec.js,test.js
if you would like to include test files in your published library.--ignore
参数会跳过*spec.js and *test.js
等测试文件,此参数是可选的,您可以删除--ignore spec.js,test.js
如果你想在您发布的库测试文件。 The --source-maps
argument includes the source maps for the included source files : --source-maps
参数包括包含的源文件的源映射: "distribute": "set NODE_ENV=production&&babel src --out-dir dist --copy-files --ignore spec.js,test.js --source-maps"
npm run distribute
which will generate the files in dist
folder.npm run distribute
将在dist
文件夹中生成文件。private: false
in package.json to make available for publishprivate: false
以供发布App.js
App.js
"main": "dist/App.js"
"publishConfig": {
"registry": ""
}
npm run publish
command to distribute your react app source code as library.npm run publish
命令将您的 React 应用程序源代码作为库分发。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.