在 vue-cli 中，除了可以使用命令行来创建和配置 vue 项目，也为您新增了界面的形式来创建和配置 vue 项目。我们可以输入 vue ui 来打开界面来配置我们的项目。
界面布局上面有 3 标签页，分别为 projects（项目）create(创建）和 import（导入），在 create 标签下我们可以创建一个项目。在下面有导航，可以浏览放置项目的位置。
点击“create a new project here” 按钮来创建一个 vue 项目，然后进入下一个页面，默认是开启 features (特性）页面吧。这里我们可以根据需要来选择一些 vue 的扩展，说是 features 也可以叫模块，选择我们项目所需的模块。router 用来配置和管理我们单页应用的路由。vuex 管理应用的状态，类似 redux 或是 flux。这让我想起 react + redux + rxjs 来创建应用。Linter 和 Formatter 规范我们的代码，提高我们的 code 质量，这里有机会给大家讲一讲 Prettier。
选择后可以将所做的选择保存下来作为预设，以便下一次使用预设来创建项目。
然后在 Project configuration（项目配置）页面中，可以配置 vue project 项目和 ESLint，提供可视化来配置我们项目的输出路径等。
ESLint 可以帮助我们检查代码，提高代码的质量。可以配置 ESLint 的规则来检查代码。ESLint 会根据我们定义的规则，检查 javascript 文件并给出 js 的报告，我们也可以定义报告输出格式和样式。
（Project tasks）项目任务，这里可以配置或写一些任务脚步，例如 serve 任务是启动我们项目，在开发模式可以边开发边调试，build 任务就是将我们项目进行构建出一些列生产环境下的 bundle 文件，lint 任务检查我们工程文件，我们当然也可以直接在 package.json 中写一些脚步。
当我们运行 serve 任务来启动项目我们可以界面上看到许多和项目相关信息，一目了然。
我们 Add a plugin 页面可以搜索安装插件，以列表形式列出所有插件，列表中可以查看到插件相关信息。
这里我们下载 vue-cli-plugin-vuetify,vuetify 个人用过是一个在 vue 接触封装一些组件的框架，感兴趣以后给大家分享一下。
在 projects 标签下可以查看我们项目的一些具体文件。
在 import 标签我们可以轻松地导入文件。
网友评论