手把手教你搭建 vue 环境

手把手教你搭建 vue 环境

第一步 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…
安装成功后 右键菜单

手把手教你搭建 vue 环境

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

手把手教你搭建 vue 环境

1.2.1 在终端输入 node -v

手把手教你搭建 vue 环境

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

手把手教你搭建 vue 环境

第三步 vue-cli脚手架安装

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

手把手教你搭建 vue 环境

看到这样

手把手教你搭建 vue 环境

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

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

手把手教你搭建 vue 环境

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

手把手教你搭建 vue 环境

我们成功了

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

手把手教你搭建 vue 环境

一直回车直到

手把手教你搭建 vue 环境

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

手把手教你搭建 vue 环境

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

手把手教你搭建 vue 环境

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

手把手教你搭建 vue 环境

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

手把手教你搭建 vue 环境

接下来 ctr+c 结束

2.5 进入 cd vue-demo

手把手教你搭建 vue 环境

2.6 执行 npm install

手把手教你搭建 vue 环境

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

手把手教你搭建 vue 环境

2.7 接下来执行 npm run dev

手把手教你搭建 vue 环境

默认浏览器会自动打开

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

手把手教你搭建 vue 环境

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

转自:https://segmentfault.com/a/1190000008922234

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/113808.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 第五章:多线程通信—wait和notify

    第五章:多线程通信—wait和notify第五章:多线程通信—wait和notify

    2022年4月23日
    47
  • SpringBoot+JWT+Shiro+MybatisPlus实现Restful快速开发后端脚手架

    SpringBoot+JWT+Shiro+MybatisPlus实现Restful快速开发后端脚手架

    2020年11月14日
    206
  • php源码审计_静态代码审计

    php源码审计_静态代码审计最近在学PHP代码审计,那就将学习的笔记都整理一遍吧~前期准备:1、安装相关软件,如Sublimetext、 Notepad++、editplus、 Seay源代码审计系统等2、获得源码,可以到网上下载各种网站源码3、安装网站审计方法:通读全文法:麻烦但全面敏感函数参数回溯法:高效常用,Seay源代码审计系统定向功能分析法:主要根据程序的业

    2022年10月2日
    5
  • 学习opencv之cvtColor

    opencv提供了cvtColor()函数,用于在图像中不同的色彩空间进行转换,用于后续处理。在使用cvtColor之前首先需要了解下基本的图像色彩模式,色彩模式决定了打印或显示的图片颜色。图像色彩模式位图模式位图模式是图像中最基本的格式,图像只有黑色和白色像素,是色彩模式中占有空间最小的,同样也叫做黑白图,它包含的信息量最少,无法包含图像中的细节,相当于只有0或者1一副彩色图如…

    2022年4月18日
    43
  • 集群技术的简介_集群的分类

    集群技术的简介_集群的分类集群技术集群(cluster)技术是一种较新的技术,通过集群技术,可以在付出较低成本的情况下获得在性能、可靠性、灵活性方面的相对较高的收益,其任务调度则是集群系统中的核心技术。集群是一组相互独立的、通过高速网络互联的计算机,它们构成了一个组,并以单一系统的模式加以管理。一个客户与集群相互作用时,集群像是一个独立的服务器。集群配置是用于提高可用性和可缩放性。中文名集群技术外文名…

    2025年6月2日
    5
  • 什么是Promise,我们用它来做什么?[通俗易懂]

    什么是Promise,我们用它来做什么?[通俗易懂]一、什么是Promise?我们用Promise来解决什么问题?Promise是异步编程的一种解决方案:从语法上讲,promise是一个对象,从它可以获取异步操作的消息;从本意上讲,它是承诺,承诺它过一段时间会给你一个结果。promise有三种状态:pending(等待态),fulfiled(成功态),rejected(失败态);状态一旦改变,就不会再变。创造promise实例后,它会立即执行。我…

    2022年6月11日
    35

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号