Vue CLI 3 Preset Web 项目骨架开发小结 | vue create -- preset
VueCLI3基本认识官网文档参考链接[1][2]@vue/cli用于交互式搭建基于vue技术栈项目的工具,通常安装在全局node_module中。它提供的命令主要有以下几个:提示在开发一个preset项目时通常关注vuecreate和vueinspect命令。@vue/cli-service用于本地开发以及编译打包,提供的命令主要是:Preset项目开发一个VueCLIpreset是一个包含创建新项目所需预定义选项和插件的JSON对象,让用户无需在命令提示中选择它们。官方preset示例:使用preset初始化项目特点可以预设项目的vue-plugin-xxx可以预设router、vuex可以预设cssPreprocessor可以预设v...
Vue CLI 3 基本认识官网文档 参考链接[1][2]
@vue/cli用于交互式搭建基于 vue 技术栈项目的工具,通常安装在全局 node_module 中。它提供的命令主要有以下几个:
提示
在开发一个 preset 项目时通常关注 vue create 和 vue inspect 命令。
@vue/cli-service用于本地开发以及编译打包,提供的命令主要是:
Preset 项目开发一个 Vue CLI preset 是一个包含创建新项目所需预定义选项和插件的 JSON 对象,让用户无需在命令提示中选择它们。
官方 preset 示例:
使用 preset 初始化项目特点 可以预设项目的 vue-plugin-xxx 可以预设 router、vuex 可以预设 cssPreprocessor 可以预设 vue.config.js 可以开启或者关闭插件的 prompts 可以提供一套文件目录结构 可以执行 Generator 和 Prompt[3][4] preset 可以是本地或者远程项目 preset 项目的结构 preset 项目的调试通过引用本地 preset 创建项目的方式进行代码调试
项目特性CSS 预编译语言:less[5]
移动 web 的适配方案:引入了 postcss-pxtorem 及 lib-flexible,可以自由地用 px 去开发
常用的 js 工具类: cloud-utils[6]
常用的 Less 的 mixins 集合:magicless[7]
stylelint 工具,使样式文件,如 less、css 更加规范。这里推崇 stylelint-config-standard,文档传送门[8] ,结合了 stylelint-order,让 css 属性展现更加高效。
style-resources-loader 可以为我们的样式文件(css、less、scss、sass、stylus)注入样式资源,统一管理资源文件,如常用的 变量(variable),混合函数(...