安装VUM

  前面学习了普通组件以后,接下来我们继续学习单文件组件则需要提前先安装准备一些组件开发工具。否则无法使用和学习单文件组件。

一般情况下,单文件组件,我们运行在 自动化工具vue-CLI中,可以帮我们编译单文件组件。所以我们需要在系统中先搭建vue-CLI工具,

  Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)。你可以使用 nvmnvm-windows在同一台电脑中管理多个 Node 版本。

nvm工具的下载和安装教程参考:

windows:https://www.jianshu.com/p/d0e0935b150a

Mac: https://www.jianshu.com/p/622ad36ee020

常用的nvm命令

nvm list # 列出目前在nvm里面安装的所有node版本 nvm install node版本号 # 安装指定版本的node.js nvm uninstall node版本号 # 卸载指定版本的node.js nvm use node版本号 # 切换当前使用的node.js版本

如果使用nvm工具,则直接可以不用自己手动下载,如果使用nvm下载安装 node的npm比较慢的时候,可以修改nvm的配置文件(在安装根目录下)

# settings.txt
root: C:\tool\nvm [这里的目录地址是安装nvm时自己设置的地址,要根据实际修改]
path: C:\tool\nodejs
arch: 64
proxy: none
node_mirror: http://npm.taobao.org/mirrors/node/
npm_mirror: https://npm.taobao.org/mirrors/npm/

安装node.js

Node.js是一个新的后端(后台)语言,它的语法和JavaScript类似,所以可以说它是属于前端的后端语言,后端语言和前端语言的区别:

  • 运行环境:后端语言一般运行在服务器端,前端语言运行在客户端的浏览器上

  • 功能:后端语言可以操作文件,可以读写数据库,前端语言不能操作文件,不能读写数据库。

我们一般安装LTS(长线支持版本):

一般暗转nodejs 我们采用以下nvm指令进行安装

常用的nvm命令

nvm list # 列出目前在nvm里面安装的所有node版本

nvm install node版本号 # 安装指定版本的node.js

nvm uninstall node版本号 # 卸载指定版本的node.js

nvm use node版本号 # 切换当前使用的node.js版本

npm

  在安装node.js完成后,在node.js中会同时帮我们安装一个npm包管理器npm。我们可以借助npm命令来安装node.js的包。这个工具相当于python的pip管理器。

npm install -g 包名              # 安装模块   -g表示全局安装,如果没有-g,则表示在当前项目安装
npm list # 查看当前目录下已安装的node包
npm view 包名 engines # 查看包所依赖的Node的版本
npm outdated # 检查包是否已经过时,命令会列出所有已过时的包
npm update 包名 # 更新node包
npm uninstall 包名 # 卸载node包
npm 命令 -h # 查看指定命令的帮助文档

安装Vue-CLI

npm install -g vue-cli

-g 表示安装全局模块,不会放在项目下
不加的话 默认放在项目文件下,随项目一起走

Vue自动化工具(Vue-CLI)的安装的更多相关文章

  1. vue 组件开发、vue自动化工具、axios使用与router的使用(3)

    一. 组件化开发 1.1 组件[component] 在网页中实现一个功能,需要使用html定义功能的内容结构,使用css声明功能的外观样式,还要使用js定义功能的特效,因此就产生了一个功能先关的代码 ...

  2. Vue自动化工具(Vue-CLI)

    一.组件的概念 1.概念 组件(Component)是自定义封装的功能.在前端开发过程中,经常出现多个网页的功能是重复的,而且很多不同的网站之间,也存在同样的功能. 而在网页中实现一个功能,需要使用h ...

  3. vue04 组件化开发 Vue自动化工具

    5. 组件化开发 5.1 组件[component] 组件(Component)是自定义封装的功能.在前端开发过程中,经常出现多个网页的功能是重复的,而且很多不同的网站之间,也存在同样的功能. 而在网 ...

  4. Vue之vue自动化工具快速搭建单页项目目录

    1 生成项目目录 使用vue自动化工具可以快速搭建单页应用项目目录. 该工具为现代化的前端开发工作流提供了开箱即用的构建配置.只需几分钟即可创建并启动一个带热重载.保存时静态检查以及可用于生产环境的构 ...

  5. 浅入深出Vue:工具准备之PostMan安装配置及Mock服务配置

    浅入深出Vue之工具准备(二):PostMan安装配置 由于家中有事,文章没顾得上.在此说声抱歉,这是工具准备的最后一章. 接下来就是开始环境搭建了~尽情期待 工欲善其事必先利其器,让我们先做好准备工 ...

  6. 浅入深出Vue:工具准备之WebStorm安装配置

    浅入深出Vue之工具准备(一):WebStorm安装配置 工欲善其事必先利其器,让我们先做好准备工作吧 导航篇 WebStorm安装配置 所有工具的下载地址都可以在导航篇中找到,这里我们下载的是最新版 ...

  7. 三: vue组件开发及自动化工具vue-cli

    一: 组件化开发 1 组件 1: 组件(Component)是自定义封装的功能.在前端开发过程中,经常出现多个网页的功能是重复的,而且很多不同的网站之间,也存在同样的功能. 2: 什么是组件 而在网页 ...

  8. Vue(学习第三部 自动化工具 [vue-cli])

    目录 Vue自动化工具(Vue-cli) 安装nide.js npm 安装Vue-sli 使用Vue-处理初始化创建起那段项目 vue项目执行流程图 单文件组件的使用 template 编写HTML代 ...

  9. Vue系列-03-vue-cli自动化工具

    使用Vue-CLI创建项目 安装vue-cli脚手架 Mac安装vue-cli脚手架 lichengguo@lichengguodeMacBook-Pro ~ % sudo npm install - ...

随机推荐

  1. 如何使用jqueryUi的datepicker日历控件?

    参考: http://www.jb51.net/article/85007.htm 这里的日历控件是, 基于jquery的jqureyui中的一个 widget. 需要js 文件: 外部的js文件, ...

  2. LabVIEW编程实例:如何通过TCP协议进行数据通信

    对于网络通信来说,LabVIEW平台本身提供了多种方法加以实现,如可以通过TCP协议.UDP协议.DataSocket技术.甚至远程面板通信技术等方式进行通信. 下面通过一个简单的例子,演示在LabV ...

  3. Maven集成Tomcat插件

    目录 类似插件及版本区别: 本地运行,启动嵌入式tomcat: 错误一: 错误二: Idea运行调试: vscode运行调试: 远程部署: 项目中的pom.xml配置: Tomcat中的tomcat- ...

  4. (转)renren-fast解读(一)

    (二期)8.renren-fast项目解读(一) [课程八]预防xss...注入.xmind0.2MB [课程八预习]开...解读.xmind0.5MB 课程八_日志处理与...模块.xmind0.2 ...

  5. 【Java----创建多级文件夹】

    File类中的mkdir()和mkdirs(): mkdir():只能创建一层目录. mkdirs():可以创建多层目录 代码:path可以是带文件名称的全路径 //路径 String path = ...

  6. centos 查看USB接口的版本

    # lsusbBus 001 Device 001: ID 1d6b:0002 Linux Foundation 2.0 root hubBus 002 Device 001: ID 1d6b:000 ...

  7. python 之 条件语句

    python 编程语言指定任何非0和非空(null)值为true, 0或者null为false. python 编程中if语句用于控制程序的执行,基本形式为: if 判断条件: 执行语句…… else ...

  8. Kubernetes工作流之Pods二

    Init Containers This feature has exited beta in 1.6. Init Containers can be specified in the PodSpec ...

  9. pgAdmin的数据恢复

    DOC 本地添加server 1.设置备份.恢复的exe路径.一般在pgAdmin的安装路径下可以找到 2.恢复restore,备份backup

  10. 常用模块(subprocess/hashlib/configparser/logging/re)

    一.subprocess(用来执行系统命令) import os cmd = r'dir D:xxx | findstr "py"' # res = subprocess.Pope ...