以下内容转自:

https://segmentfault.com/a/1190000008922234

第一步 node环境安装

1.1 如果本机没有安装node运行环境,请下载node 安装包进行安装
1.2 如果本机已经安装node的运行换,请更新至最新的node 版本
下载地址:https://nodejs.org/en/ 或者 http://nodejs.cn/

第二步 node环境检测

为了快乐的使用命令行,我们推荐使用 gitbas
1.1 下载git 并安装
下载地址 https://git-for-windows.githu...
安装成功后 右键菜单

我们可以看到 Gti Bash Here 。说明我们已经安装成功git
1.2 检测node 是否安装成功
右键空白,选择 Gti Bash Here 弹出

1.2.1 在终端输入 node -v

如果输出版本号,说明我们安装node 环境成功
随便我们可以查看 npm 的 版本号
可以使用 npm -v

第三步 vue-cli脚手架安装

2.1 如果访问外网比较慢,可以使用淘宝的镜像 https://npm.taobao.org/
打开命令终端 npm install -g cnpm --registry=https://registry.npm.taobao.org
回车之后,我就可以可以快乐的用 cnpm 替代 npm

看到这样

恭喜你,你已经成功安装了 cnpm
但是此后,我们还是使用 npm 来运行命令

2.2 接下来就是重点了 安装vue-cli
npm install vue-cli -g

如果你很幸运,那么接下来就是这样的

我们成功了

2.3 进入我们的项目目录,右键 Gti Bash Here
2.4 初始化项目 vue init webpack vue-demo

一直回车直到

是否要安装 vue-router 项目中肯定要使用到 所以 y 回车

是否需要 js 语法检测 目前我们不需要 所以 n 回车

是否安装 单元测试工具 目前我们不需要 所以 n 回车

是否需要 端到端测试工具 目前我们不需要 所以 n 回车

接下来 ctr+c 结束

2.5 进入 cd vue-demo

2.6 执行 npm install

如果出现下图,说明安装成功

2.7 接下来执行 npm run dev

默认浏览器会自动打开

注意:如果您的浏览器是ie9以下的版本,请升级浏览器到最新版本或者下载谷歌浏览器或者火狐浏览器进行预览。在地址栏输入 http://localhost:8080/#/进行访问

恭喜,你已经成功安装,并运行起来vue基础项目,踏入了vue的大门。

转载:手把手教你搭建 vue 环境的更多相关文章

  1. 手把手教你搭建 vue 环境

    第一步 node环境安装 1.1 如果本机没有安装node运行环境,请下载node 安装包进行安装1.2 如果本机已经安装node的运行换,请更新至最新的node 版本下载地址:https://nod ...

  2. 【MIT6.S081/6.828】手把手教你搭建开发环境

    目录 1. 简介 2. 安装ubuntu20.04 3. 更换源 3.1 更换/etc/apt/sources.list文件里的源 3.2 备份源列表 3.3 打开sources.list文件修改 3 ...

  3. 手把手教你搭建Pytest+Allure2.X环境详细教程,生成让你一见钟情的测试报告(非常详细,非常实用)

    简介 宏哥之前在做接口自动化的时候,用的测试报告是HTMLTestRunner,虽说自定义模板后能满足基本诉求,但是仍显得不够档次,高端,大气,遂想用其他优秀的report框架替换之.一次偶然的机会, ...

  4. 庐山真面目之十一微服务架构手把手教你搭建基于Jenkins的企业级CI/CD环境

    庐山真面目之十一微服务架构手把手教你搭建基于Jenkins的企业级CI/CD环境 一.介绍 说起微服务架构来,有一个环节是少不了的,那就是CI/CD持续集成的环境.当然,搭建CI/CD环境的工具很多, ...

  5. 手把手教你搭建FastDFS集群(下)

    手把手教你搭建FastDFS集群(下) 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csdn.net/u0 ...

  6. 手把手教你搭建FastDFS集群(中)

    手把手教你搭建FastDFS集群(中) 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csdn.net/u0 ...

  7. 大数据江湖之即席查询与分析(下篇)--手把手教你搭建即席查询与分析Demo

    上篇小弟分享了几个“即席查询与分析”的典型案例,引起了不少共鸣,好多小伙伴迫不及待地追问我们:说好的“手把手教你搭建即席查询与分析Demo”啥时候能出?说到就得做到,差啥不能差人品,本篇只分享技术干货 ...

  8. 手把手教你搭建FastDFS集群(上)

    手把手教你搭建FastDFS集群(上) 本文链接:https://blog.csdn.net/u012453843/article/details/68957209        FastDFS是一个 ...

  9. 手把手教你搭建 ELK 实时日志分析平台

    本篇文章主要是手把手教你搭建 ELK 实时日志分析平台,那么,ELK 到底是什么呢? ELK 是三个开源项目的首字母缩写,这三个项目分别是:Elasticsearch.Logstash 和 Kiban ...

随机推荐

  1. centos7初始优化

    第1章 优化 1.1 修改yum源 epel源 curl -o /etc/yum.repos.d/CentOS-Base.repo http://mirrors.aliyun.com/repo/Cen ...

  2. TCP并发服务器简单示例

    并发服务器的思想是每一个客户的请求并不由服务器直接处理,而是由服务器创建一个子进程来处理 1. 服务器端 #include <stdio.h> #include <sys/types ...

  3. 协议 + socket import 和 form xx import *的区别 028

    一 . 网络通信协议(了解) 1 . osi 七层协议 (最好记住 面试会问) 应表会传网数物(应用层 表示层 会话层 传输层 网络层 数据链路层 物理层) 2 .tcp/ip五层 或 tcp/ip四 ...

  4. springmvc怎么重定向

    转载大神: https://blog.csdn.net/wabiaozia/article/details/50252661

  5. spring @Transactional事务失效

    不开事务几种情形 ① @Transactional写在了private方法上 org.springframework.transaction.interceptor.AbstractFallbackT ...

  6. Python报错:UnicodeEncodeError 'gbk' codec can't encode character

    今天在使用Python文件处理写网络上爬取的文件的时候,遇到了错误:UnicodeEncodeError: ‘gbk’ codec can’t encode character ‘\xa0’ in p ...

  7. my21_myloader -o参数

    -o 参数 如果不使用-o参数,遇到第一个有主键或者唯一约束的数据,则退出当前线程:如果有-o参数,则删除原来的表,创建新表,再插入数据,主键不会发生变化. ** Message: Dropping ...

  8. ES6多行字符串+模板字符串

    多行字符串 最新的ES6标准新增了一种多行字符串的表示方法,用反引号 ` ... ` 表示: 'use strict'; // 如果浏览器支持模板字符串,将会替换字符串内部的变量: var name ...

  9. tomcat正常关闭,端口号占用解决 StandardServer.await: create[8005]:

    cmd进入依次输入以下三个命令 1:netstat -ano | findstr "8005"2:tasklist | findstr "5632" 3:tas ...

  10. Win7 IIS 局域网中无法访问网页

    安装好iis后,在局域网中无法浏览网页一,关闭防火墙即可 或者建立入站规则 打开控制面板——window防火墙——高级设置 在入站规则上右键新建入站规则,选择端口然后下一步 选择tcp和特定端口在端口 ...