1.0.0 • Published 5 years ago
lcc-react-demo-component v1.0.0
reactComponent2npm
发布 react组件 的脚手架
相关博客(详细说明):使用npm发布一个react组件
开发组件
- 安装依赖: - npm i npm start
- 打包组件 - npm run build
组件功能测试
- 项目根目录下执行: - npm link cd src/example npm link react-demo-component # 此处为package.json中定义的name字段
- 修改example/src/app.js 文件内容(将原本导入开发组件替换成打包后的组件): - // import ReactDemo from '../../src' // 组件源代码 import ReactDemo from 'react-demo-component'; // npm link 测试打包组件的功能 import 'react-demo-component/lib/main.min.css'; // npm link 测试打包组件的功能
- 根目录执行: - npm start
组件发布到npm
- 查看当前使用的源地址: - npm config list
- 如果不是官方源地址,通过下面的命令切换 npm 源: - npm config set registry http://registry.npmjs.org
- 组件发布到 npm: - npm run pub # 上面的命令效果与下面的命令效果一样 npm build npm publish
- 取消发布(最好不要,别人可能下载了你的包): - npm unpublish react-demo-component --force # 此处为package.json中定义的name字段
npm 包的使用与下载
- 下载: - npm i react-demo-component # 假设你的包名字叫react-demo-component
- 使用方法: - # 组件中引入 import ReactDemo from 'react-demo-component'; # 如果给组件写了样式,需要手动导入css文件 import 'react-demo-component/lib/main.min.css';
1.0.0
5 years ago