Vue.js 安装教程

安装node.js

https://nodejs.org/zh-cn/download/

选择一个适合自己电脑的版本下载

下载成功, 直接安装, 全部点击下一步

然后输入 黑窗口输入 node 出现以下界面成功

黑窗口输入 npm 出现下图成功

安装vue

切换淘宝源

华为源 百度源 ... 都可以, 根据自己喜好

从外网下载特别慢 ,所以切换成国内的镜像

#直接命令行的设置
$ npm config set registry https://registry.npm.taobao.org
#检测是否安装成功
$ npm config get registry

NPM 安装vue

黑窗口

# 最新稳定版
$ npm install vue

CDN 引入

html 内引入

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

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

脚手架安装

Vue CLi 命令行工具

黑窗口

安装


npm install -g @vue/cli
# OR
yarn global add @vue/cli

创建一个项目:

#手动命令行创建
vue create my-project
# OR GUI界面创建 对新手非常友好
vue ui

#创建项目的时候不要添加 代码规范检查工具 esLine 不然会头疼

如果读了这个教程还是没安装成功

那就去找已经安装成功的同学帮你一下

Vue.js 教程地址:

Vue.js 中文网:

https://cn.vuejs.org/v2/guide/

vue安装教程的更多相关文章

  1. [Vue安装教程]十分钟学会vue 安装

    Vue的安装主要有一下几个步骤: 1.安装npm淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 2.安装脚手架工 ...

  2. 2.vue 安装教程

    安装node.js 从node.js官网下载并安装node,安装过程很简单,一路"下一步"就可以了(傻瓜式安装). 安装完成之后,打开命令行工具,输入 node -v,如下图,如果 ...

  3. vue安装教程总结

    转载:https://blog.csdn.net/sunny1660/article/details/78326548 简介:       vue.js是一套构建用户界面的渐进式框架.比较简洁,用于解 ...

  4. vue 安装教程(自己安装过程及遇到的一些坑)

    1.安装node.js(http://www.runoob.com/nodejs/nodejs-install-setup.html) 2.基于node.js,利用淘宝npm镜像安装相关依赖 在cmd ...

  5. Vue 安装教程

    1.下载node.js https://nodejs.org/en/ 2.检查环境变量: npm init (初始化项目) npm i webpack vue vue-loader 安装依赖: npm ...

  6. nodeJs+vue安装教程详解 相信

    相信很多朋友都在装node服务和安装vue的时候会遇到一些问题,下面为大家详细介绍node服务的安装以及vue的安装: 1.nodeJs官网下载版本(根据自己电脑的配置进行相应下载即可):默认安装路径 ...

  7. VUE 入门教程

    http://www.runoob.com/w3cnote/vue-js-quickstart.html VUE安装教程 https://segmentfault.com/a/119000001218 ...

  8. Vue框架下的node.js安装教程

    Vue框架下的node.js安装教程 python服务器.php  ->aphche.java ->tomcat.   iis -->它是一个可以运行JAVASCRIPTR 的运行环 ...

  9. npm安装vue详细教程(图片详解)

    npm安装vue详细教程(图片详解) 一.总结 一句话总结:整个安装流程照着教程来,注意系统环境变量的配置,注意一下npm的本地仓库和缓存位置 教程 系统环境变量 仓库 缓存 1.什么情况下最适合用n ...

随机推荐

  1. TCP/IP网络编程之数据包协议

    一.概要 在了解了网络字节序之后,接下来就是要讲最最重点的消息协议.数据包是什么呢,数据包可以理解为两个人讲电话说的每一句话的内容.通过大家约定好的方式去理解.达到只有接听电话两个人才懂的东西.在程序 ...

  2. 轻轻松松学CSS:float

    float属性,会使元素向左或向右移动,其周围的元素也会重新排列.float不仅自己飘忽不定,还对周围元素有影响,这种影响力不容小觑.他捉摸不定(浮动规律不好把握),他干涉他国内政(对周围元素有影响) ...

  3. 【Android】Scrollview返回顶部,快速返回顶部的功能实现,详解代码。

    作者:程序员小冰,GitHub主页:https://github.com/QQ986945193 新浪微博:http://weibo.com/mcxiaobing 首先给大家看一下我们今天这个最终实现 ...

  4. Java Android程序员软件开发知识:枚举的介绍,以及代码的编写教程。

    Java枚举 Java 5.0引入了枚举,枚举限制变量只能是预先设定好的值.使用枚举可以减少代码中的bug. 例如,我们为果汁店设计一个程序,它将限制果汁为小杯.中杯.大杯.这就意味着它不允许顾客点除 ...

  5. css学习入门-第一个css程序

    1.css的优势: --内容与表现分离 --网页结构统一,可以实现复用 --样式丰富 2.css的3种导入方式 2.1行内样式 <h1 style="color: red"& ...

  6. POJ-3255-Roadblocks(次短路的另一种求法)

    Bessie has moved to a small farm and sometimes enjoys returning to visit one of her best friends. Sh ...

  7. Currency Exchange(SPFA判负环)

    Several currency exchange points are working in our city. Let us suppose that each point specializes ...

  8. Math Problem(数学)

    链接:https://ac.nowcoder.com/acm/contest/893/C来源:牛客网 时间限制:C/C++ 1秒,其他语言2秒 空间限制:C/C++ 32768K,其他语言65536K ...

  9. termux 进阶

    直接正题. 1.优化键位: mkdir $HOME/.termux echo "extra-keys = [['ESC','/','-','HOME','UP','END','PGUP'], ...

  10. SSM框架之mybatis极速入门!