Yb-components Yb-components
首页
开发规范
yb-cli
  • 开发指南
  • 更新日志
  • 组件
关于
首页
开发规范
yb-cli
  • 开发指南
  • 更新日志
  • 组件
关于
  • yb-cli
    • 为什么不直接用vue-cli
    • 为什么不只使用vite
    • 使用
  • web项目开发模板
  • vue组件包开发模板
  • Layui项目开发模板
  • yb-cli
zougt
2021-07-29

yb-cli

一个快速创建基于vue2 + element-ui +yb-components + vite + webpack的前端项目工程的脚手架

# 为什么不直接用vue-cli

vue-cli5创建的工程依然是基于webpack作为构建工具,webpack将所有编译好后才完成启动服务,源码越多启动越慢,vite的出现带来了更快的开发体验,按需编译,极快的冷启动;

yb-cli创建的工程在vue-cli创建的工程基础上添加了vite作为开发时的编译工具,并且保留了vue-cli的所有特性

还定制了vue2 + vue-router + element-ui + yb-components的默认使用模型,以及我们项目的主页的默认结构,还有路由去中心化管理和自动搜索源码文件生成按需引入组件库的组件的模块。

# 为什么不只使用vite

vite生产构建出的产物最低只能在IE11+上运行,我们的项目可能会在IE9+运行,所以还是需要webpack来构建生产。

# 使用

# 查看npm的源是不是私服:
# http://192.168.1.100:8081/repository/npm-all
# http://111.230.194.183:8081/repository/npm-all(外网)
npm config get registry

# 如果不是,修改npm源为私服地址
npm config set registry http://192.168.1.100:8081/repository/npm-all
# npm config set registry http://111.230.194.183:8081/repository/npm-all(外网)

# 初始化一个项目
npx yb-cli init projectName

? 请确认是否在当前目录/Applications/web-design下创建项目: Yes
? 项目描述: vue project
? 创建者: zougt-zgtusers@outlook.com
? 模板: 
❯ create-web-template 
  create-librray-template 

cd projectName
npm run dev

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

# 重装所有最新依赖的步骤

# 删除node_modules和yarn.lock
npx rimraf node_modules yarn.lock

# 安装依赖
npx yarn
1
2
3
4
5

# web项目开发模板(create-web-template)

web项目的工程模板,默认引入了 vue2、vue-router、element-ui、yb-components、axios,更多请看 web项目开发模板.

# Vue组件包开发模板(create-librray-template)

写前端通用vue组件和markdown写组件文档的工程模板,支持markdown的代码块中写vue组件并渲染成demo,更多请看 Vue组件包开发模板.

上次更新: 2022/05/11, 10:53:55
web项目开发模板

web项目开发模板→

Theme by Vdoing | Copyright © 2021-2025 YB-GZ | MIT License
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式