xq-web-app-cli

初始化react项目文件

Usage no npm install needed!

<script type="module">
  import xqWebAppCli from 'https://cdn.skypack.dev/xq-web-app-cli';
</script>

README

react项目初始化模板

安装说明 (该库已上传到 http://npm.dev.78dk.com)

1、npm set registry http://npm.dev.78dk.com

2、npm adduser --registry http://npm.dev.78dk.com

3、输入用户名、密码、邮箱完成注册

4、npm login 输入用户名、密码 登录 http://npm.dev.78dk.com

5、安装 npm install xq-web-app-cli -g

6、xq-web-app-cli -V 输出版本信息,表示安装正确

7、初始化一个项目 xq-web-app-cli

8、自动安装node包由于网络原因可能会失败,安装失败的请手动安装

9、在项目根目录下运行 yarn run create 或者 npm run create 根据app.config.json配置文件创建页面并生成路由信息(自动生成的页面在src/view目录下)

10、yarn start 或者 npm start 运行项目

注意事项:

1、每次更改app.config.json文件时需要重新运行 yarn run create 并重启项目

初始化目录结构

├── config  
│   │
│   └── webpack.config.dev.js  开发环境配置
│   │
│   └── webpack.config.prod.js  生成环境打包配置
|   
├── public
|   │
│   └── config.js  请求域名配置文件
|   |
│   └── favicon.icon  icon图标
│   │
│   └── index.html  项目模板页面
│
├── scripts
|   │
│   └── build.js  项目打包脚本
|   |
│   └── start.js  项目启动脚本
|
├── src
|   │
│   └── assets  放置静态资源
|   |   |
│   |   └── fonts  字体文件
│   |   |
│   |   └── images  图片
│   |   |
│   |   └── libs  其它库文件(项目打包时会将此文件夹整体复制过去)
│   |   |
│   |   └── styles  公用css
│   |   |
│   |   └── utils  常用工具方法
│   |       |
│   |       └── cookie.js  cookie的操作方法
│   |       |
│   |       └── emitter.js  自定义事件的注册于触发
│   |       |
│   |       └── formatter.js  日期格式的处理(请使用moment.js库,功能更强大)
│   |       |
│   |       └── http.js  基于axios的请求封装
│   |       |
│   |       └── validator.js  常用的正则验证
|   |    
│   └── components  组件   
|   |   |
|   |   └── form  基于antd表单验证组件封装
|   |   |
|   |   └── table  基于antd列表组件封装
|   |   
|   └── service  所有的请求放在这里
|   |
|   └── app.config.json  自动生成页面和路由的配置文件
|   |
|   └── index.js  项目入口文件
|   |
|   └── .eslintrc.dev.json  代码规范校验配置
|   |
|   └── .eslintrc.prod.json  代码规范校验配置
|   |
|   └── .gitignore  git忽略文件
|   |
|   └── package.json  项目node依赖配置
|   |
|   └── README.json  
|   | 
|   └── yarn.lock  yarn安装依赖锁