cva-hh v1.0.5

creat-vue-app

自动化构建工具之create-vue-app的设计与实现

• dev-server

• 能够处理下面这些文件 所需loader

  vue-template	css	js	less	scss/sass	img	font
  Vue.js	Css.loader style.loader	babel.loader	Less.loader style.loader	Sass.loader style.loader	file-loader image-webpack-loader	file.loader

• Vue-router在页面模块较多的情况下的配置

• Vuex 在项目中基本使用,和一些稍微复杂的demo

• vue组件间的其他三种传值demo 父传子 子传父 兄弟组件间值得传递(这个主要使用在依赖传递的值模块较少的情况下共享数据,eventBus)

• 组件库引入 pc端 element-ui antDesign 移动端h5 vant-ui mint-ui antDesign-mobile

• 开发阶段的本地代理(开发阶段处理跨域问题)

• 开发中常用的js方法,比如时间格式化方法,localstorage整体的一个处理,cookie的处理,节流防抖函数以及使用demo.

• axios的封装(可以根据不同环境下使用不同的代理或者是其他的需要根据不同的环境后端提供的接口中需要添加不同的字段)

• 尽量能在生产模式下可以直接将打包好的文件自动到cdn,这样的话可以仅仅将html文件放到自己的服务器上就可以了(自己的服务器基本是只提供接口的访问就行,节省带宽)

  以下是脚手架用到的一些插件和工具

  工具名称	作用	参考地址
  commander	命令编写	https://github.com/tj/commander.js/blob/HEAD/Readme_zh-CN.md
  download-git-repo	下载git模板	https://www.npmjs.com/package/download-git-repo
  inquirer	命令行交互，获取用户输入	https://www.npmjs.com/package/inquirer
  ora	进度条	https://www.npmjs.com/package/ora
  chalk	让输出带颜色	https://www.npmjs.com/package/chalk
  handlebars	模板化语言	https://www.npmjs.com/package/handlebars
  cFonts	特殊文字	https://www.npmjs.com/package/cfonts 暂未使用
  metalsmith	模板	https://www.npmjs.com/package/metalsmith 暂未使用
  log-symbols	错误标记	https://www.npmjs.com/package/log-symbols
  glob	全局文件搜索	https://www.npmjs.com/package/glob

模板使用到的插件和工具

下阶段的工作

• 将交互命令和模板链接起来,根据用户的选择和输入能做一些用户自定义的配置
• 将pc端的ts版本抓紧时间搞出来(顺便搞一下ts)
• 有时间熟悉一下@vue/cli的可视化界面的交互,争取给脚手架也做一个自定义的可视化页面
• 有时间的话搞一下h5端
• h5端 (js 和 ts 两个版本 针对移动端屏幕和常用的交互指定相应的结构和工具函数)
• 重构一下之前的IRH后台管理项目作为pc端实践