1.0.16 • Published 10 months ago
@weblife-wei/web_design v1.0.16
web_design
构建依赖
使用 npm install 或 yarn
$ npm install
or
$ yarn
启动开发环境
$ npm start
or
$ yarn start
文档网站编译
$ npm run docs:build
or
$ yarn docs:build
运行单元测试
$ npm test
or
$ yarn test
如果只想运行指定组件的单元测试文件
## 这里不一定是index.test.tsx文件,也可以是其他符合.test.tsx单元测试规范的文件
$ npm test 组件名/index.test.tsx
or
$ yarn test 组件名/index.test.tsx
构建组件库模块
$ npm run build
or
$ yarn build
本地工程引入
需要打开工程所在文件夹位置,先使用 build 指令进行组件库构建。\ 之后输入 link 指令,将组件库关联到本地 npm。
$ npm link
or
$ yarn link
打开需要引入组件库的工程所在位置。\ 使用 link 指令,引入 web_design 组件库。
$ npm link web_design
or
$ yarn link web_desgin
即可在工程中使用 web_design 组件库。
import { EllipsisSpan } from 'web_design/es/index';
export default () => <EllipsisSpan width={80} value={'雨是最寻常的,一下就是三两天。'} />;
则本地编译时候,需要保持 link 状态。
下载依赖导入
进入使用 npm 下载 web_design 依赖
$ npm install @weblife-wei/web_design
or
$ yarn add @weblife-wei/web_design
import { EllipsisSpan } from '@weblife-wei/web_design/src';
export default () => <EllipsisSpan width={80} value={'雨是最寻常的,一下就是三两天。'} />;
Markdown 入门开发
网站组件库文档开发主要围绕则 Markdown 文件进行,则需要熟练掌握 Markdown 文档。
Markdown 中文 API 网站:http://markdown.p2hp.com/index.html
npm发布的注意点
需要将package.json文件中的name修改为:@weblife-wei/web_design;
每次发布需要将package.json中的version版本更新;