在本文中,我将引导您完成为 React.js 应用程序创建和发布 npm 包的过程。
首先,运行以下命令:
npx create-react-library react-loader
这将生成一个基本的 React.js 应用程序/包。运行命令后,您将看到如下项目结构:
在 src 文件夹中,您将找到一个index.js 文件。
您可以直接在index.js文件中创建库组件,也可以在src文件夹中创建一个新的组件文件并从index.js文件中导出它,如下所示:
如果您的组件使用 CSS,请务必将其导入到您的组件文件中。
接下来,如果您的项目中有 dist 文件夹,请将其删除。要测试您的组件是否正常运行,请导航到 example/src 文件夹。
在 App.js 文件中,导入您的组件,如下所示。这与您将此库作为 npm 包包含在其他项目中的方法相同。
要运行应用程序,请执行以下命令:
cd react-loader && npm start
cd react-loader/example && npm start
测试您的库后,就可以发布它了。
如果您已经为项目设置了存储库,只需推送最终更改即可。否则,创建一个新的存储库并推送您的更改。
您还需要在项目的根目录创建一个 .npmignore 文件,其功能类似于 NPM 的 .gitignore 文件。它会阻止某些文件和文件夹(如 node_modules、.git、.gitignore 等)发布到 NPM 注册表。
推送更改后,运行命令 npm login。系统会提示您在浏览器中打开 NPM,您可以在其中登录您的帐户或注册(如果您没有帐户)。然后,执行 npmpublish,这会将您的 dist 文件夹发布到 NPM,并使用 package.json 文件中指定的版本。
软件包发布后,您可以在 NPM 网站上查看它,方法是搜索您的软件包名称或访问您的个人资料,其中将列出您的所有软件包。
关注更多你可以在这里找到我
以上是在 React.JS 中创建 NPM 包的详细内容。更多信息请关注PHP中文网其他相关文章!