Vue、脚手架的安装和使用

1、什么是Vue？

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

2、Vue的安装

• 环境
  • 开发环境：项⽬研发阶段，程序还在开发
  • ⽣产环境： 项⽬已经研发结束，项⽬已经部署
• 版本

  • 开发版本： 开发阶段使⽤的版本

    <!-- 开发环境版本，包含了有帮助的命令⾏警告 -->
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    

  • ⽣成版本： 部署阶段使⽤的版本

    <!-- ⽣产环境版本，优化了尺⼨和速度 -->
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
    

3、基础使用

• 安装vue.js

  • 下载Vue
    

  • 在项目的head标签内部引入

    <script src="./vue.js"></script>
    

3、node.js环境的安装

• 打开node.js 中文网：https://nodejs.org/zh-cn/
• 找到下载： https://nodejs.org/zh-cn/download/
• 选择windows安装包 下载
• 下载完成之后，打开装个windows安装包，一路next 下去， 最后等安装完成！
• 检测安装是否成功： 打开电脑的cmd命令行窗口： 输入node -v 如果显示版本号说明安装node环境成功！
  

4、vue-cli脚手架安装

• 安装淘宝镜像

  npm install -g cnpm --registry=https://registry.npm.taobao.org   //Windows
  sudo npm install -g cnpm --registry=https://registry.npm.taobao.org  //Mac
  

• 检测淘宝镜像是否安装成功

  cnpm -v //显示版本号就是成功
  

  

• 安装脚手架

  npm i vue-cli -g					// windows
  sudo  npm i vue-cli -g    // mac  
  

  若安装了淘宝镜像就可用如下链接

  cnpm i vue-cli -g							// windows
  sudo cnpm i vue-cli -g        // mac  
  

• 检测安装是否成功

  vue -V      // 显示版本号说明安装成功