同步操作将从 轩小浅/create-quick 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
约定代替编码,更灵活、迅速的脚手架搭建工具(mini版)
create-mini-quick是 create-quick最小化demo
第一步:clone本仓库:
git clone https://gitee.com/lianxuan7/create-quick.git
第二步:安装依赖和测试:
# 安装依赖
npm i # pnpm i
# 打包文件
npm run build
# 运行脚手架
node outfile.cjs
base
、options
、ejs
(可通过配置变量自定义命名)package.json
会和base的package.json
进行合并,其他文件全是替换ejsData.js
为参数变量,用于给ejs模板引擎渲染的,该文件也不会添加到base里(可通过配置变量自定义命名)main.ts.ejs
文件名最终合并到base里面的名字为main.ts
,也会覆盖base第三步:使用者只需要关心根目录下的templatesData.json
询问数据和template
模板文件夹即可:
查看templates
文件夹下面有两个文件夹uniapp-vue3
和vue3
,它们分别是不同的项目模板,我们找到vue3
模板来介绍:
vue3
文件夹下面有三个文件夹base
、ejs
、options
,它们分别是基础项目、引入配置、项目选项
base
我们就不需要介绍了,它是一个项目的最基本架构,必不可少
ejs
是什么呢?举个例子:我们vue3项目有可选配置pinia
/vue-router
,它们如果需要使用是不是需要在main.ts
文件中引入?对,ejs
文件夹就是这样的一个作用,我们使用了ejs模板引擎进行渲染:
// main.ts.ejs
<%- importList -%>
import { createApp } from 'vue'
import App from './App.vue'
import '@/style/reset.css'
const app = createApp(App)
<%- useList -%>
app.mount('#app')
options
文件夹就是可选的配置,里面的目录结构需要和base
文件夹一一对应,里面除了package.json
是和base
合并,其他都是覆盖。值得一提的是options
文件夹下面还可以有一个config-text.js
文件,这个是什么呢?这个就是ejs
的数据,也不会添加到base
目录
// config-text.js
module.exports = {
descripts: 'pinia',
importList: `import pinia from '@/store/index' \n`,
useList: `app.use(pinia) \n`,
callback(traget, config) { // 当前options复制之后会调用这个函数
console.log(traget)
console.log(config)
}
}
templateData.json
是询问需要的数据:
// templatesData.json
{
"vue3": {
"title": "vue3 + vue-router",
"options": [
{
"title": "pinia状态管理",
"value": "pinia"
},
{
"title": "prettier格式化",
"value": "prettier"
},
{
"title": "vue-router路由",
"value": "vue-router"
}
]
},
"uniapp-vue3": {
"title": "uniapp的vue3版本",
"options": []
}
}
前往最小化demo仓库 create-mini-quick
QQ群: qian-cli(746382337)
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。