渐进式 JavaScript 框架Vue环境搭建（一）

vue

• Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。

 

 VUE CLI

• CLI (@vue/cli) 是一个全局安装的 npm 包，提供了终端里的 vue 命令。它可以通过 vue create 快速创建一个新项目的脚手架，或者直接通过 vue serve 构建新想法的原型。你也可以通过 vue ui 通过一套图形化界面管理你的所有项目。说的简单一点就是引用的js库多的时候使用CLI构建使页面变得清爽。VUE CLI依赖于node.js,需要先安装node.js。和redis cli 差不多提供一些命令。

VUE CLI 3使用

安装node.js：链接

• 打开cmd安装淘宝镜像

• npm install -g cnpm --registry=https://registry.npm.taobao.org

• 打开cmd可以使用下列任一命令安装：

• cnpm install -g @vue/cli
  

• 卸载 

• cnpm uninstall @vue-cli -g

• 安装之后，你就可以在命令行中访问 vue 命令。你可以通过简单运行 vue，看看是否展示出了一份所有可用命令的帮助信息，来验证它是否安装成功。
• 你还可以用这个命令来检查其版本是否正确 (3.x)：

• vue --version

vue serve 

•  vue serve 和 vue build 命令对单个 *.vue 文件进行快速原型开发，不过这需要先额外安装一个全局的扩展：

• cnpm install -g @vue/cli-service-global
  

• vue serve 的缺点就是它需要安装全局依赖，这使得它在不同机器上的一致性不能得到保证。因此这只适用于快速原型开发。

• Usage: serve [options] [entry]
  
  在开发环境模式下零配置为 .js 或 .vue 文件启动一个服务器
  
  
  Options:
  
    -o, --open  打开浏览器
    -c, --copy  将本地 URL 复制到剪切板
    -h, --help  输出用法信息

vue build

• Usage: build [options] [entry]
  
  在生产环境模式下零配置构建一个 .js 或 .vue 文件
  
  
  Options:
  
    -t, --target <target>  构建目标 (app | lib | wc | wc-async, 默认值：app)
    -n, --name <name>      库的名字或 Web Components 组件的名字 (默认值：入口文件名)
    -d, --dest <dir>       输出目录 (默认值：dist)
    -h, --help             输出用法信息
  

• vue build 也提供了将组件构建成为一个库或一个 Web Components 组件的能力。