Azure DevOps Server 的连接源（Artifacts）：九、vue示例和自动打包

1. 概述

Vue是一个基于Nodejs的前端框架，目前被广泛应用于前后端分离的前端开发中。本文演示结合Azure DevOps Server，使用vue快速创建一个web前端应用，并实现自动编译和打包。

2. 环境准备

参考前面的章节《npm 基础》中的说明，配置npm环境，并使用淘宝镜像作为包文件的连接源

3. 创建vue示例应用

3.1 在全局目录中安装vue-cli

npm install vue-cli -g

3.2 使用vue-cli初始化web应用hello-vue

vue init webpack hello-vue

如果不熟悉每个参数，一路回车使用默认值，如下图
命令行将在当前目录中新建一个目录hello-vue，并将初始化的html、js和css等保存在这个目录中，同时将所有依赖的包下载到node_modules中

D:\temp\vue>vue init webpack hello-vue

? Project name hello-vue
? Project description A Vue.js project
? Author 张洪君 <zhanghongjun@bjgreatsoft.com>
? Vue build standalone
? Install vue-router? Yes
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Set up unit tests Yes
? Pick a test runner jes