如何使用 create-react-app 在 npm 上发布 React 组件？

Question

我已经使用create-react-app创建了一个通知，但我只是混淆了如何在 NPM 上发布它。

我阅读了这篇文章，但就我而言，我使用的是 create-react-app。

我的package.json ：

           {
"name": "react-notify",
"version": "0.1.0",
"description": "Push notification component for React",
"main": "./src/Notification/index", // I changed the index
"license": "MIT",
"dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.30",
    "@fortawesome/free-brands-svg-icons": "^5.14.0",
    "@fortawesome/free-solid-svg-icons": "^5.14.0",
    "@fortawesome/react-fontawesome": "^0.1.11",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-scripts": "3.4.3",
    "styled-components": "^5.2.0"
},
"scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "storybook": "start-storybook -p 6006 -s public",
    "build-storybook": "build-storybook -s public"
},
"eslintConfig": {
    "extends": "react-app"
},
"browserslist": {
    "production": [
        ">0.2%",
        "not dead",
        "not op_mini all"
    ],
    "development": [
        "last 1 chrome version",
        "last 1 firefox version",
        "last 1 safari version"
    ]
},
"resolutions": {
    "styled-components": "^5"
},
"devDependencies": {
    "@babel/core": "^7.11.6",
    "@storybook/addon-actions": "^6.0.21",
    "@storybook/addon-essentials": "^6.0.21",
    "@storybook/addon-links": "^6.0.21",
    "@storybook/node-logger": "^6.0.21",
    "@storybook/preset-create-react-app": "^3.1.4",
    "@storybook/react": "^6.0.21",
    "babel-loader": "^8.1.0",
    "enzyme": "^3.11.0",
    "enzyme-adapter-react-16": "^1.15.4",
    "enzyme-to-json": "^3.5.0",
    "react-addons-test-utils": "^15.6.2",
    "react-is": "^16.13.1",
    "react-test-renderer": "^16.13.1"
}

}

我试过了 ：

 npm run build
 npm pack

然后，我想在发布之前在本地测试它：

import Notification from "react-notify-1.0.0.tgz

但我收到此错误：

   InvalidCharacterError: Failed to execute 'createElement' on 'Document': The tag name provided ('/static/media/react-notify-0.1.0.cb5a6811.tgz') is not a valid name.