vue-cli创建vue项目
原文出处: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-cli创建vue项目的更多相关文章
- vue cli创建typescript项目
使用最新的Vue CLI @vue/cli创建typescript项目,使用vue -V查看当前的vue cli版本 安装命令 npm install -g @vue-cli 创建项目 vue cre ...
- vue cli创建的项目 当你后期使用了ES6语法,如何解决浏览器兼容问题
最近开发了一个项目,开发过程中,由于需要使用了async await ,于是发现,只有少数的浏览器支持,极大多数的浏览器是不支持这玩意的,在网上各种找解决方案,基本都是失败,最后总结了两个方案之后,尝 ...
- 用vue ui创建的项目怎么关闭eslint校验
在Vue Cli的控制面板找到配置-ESLint configuration,然后关闭保存时检查就可以了
- Vue CLI及其vue.config.js(一)
有时候我们为了快速搭建一个vue的完整系统,经常会用到vue-cli,vue-cli用起来很方便而且命令简单容易上手,但缺点是在构建的时候我感觉有一些慢,因为CLI 服务 (@vue/cli-serv ...
- 解决@vue/cli 创建项目是安装chromedriver时失败的问题
最近在使用新版vue的命令行工具创建项目时,安装chromedriver老是失败,导致后面的步骤也没有进行.网上搜索了一下,全是使用 工作中常见问题汇总及解决方案 npm install chrome ...
- 用vue脚手架创建bootstrap-vue项目
用vue脚手架创建bootstrap-vue项目 框架的地址:https://bootstrap-vue.js.org/docs/ 第一步 vue init webpack demo第二步 cd de ...
- [Vue CLI 3] vue inspect 的源码设计实现
首先,请记住: 它在新版本的脚手架项目里面非常重要 它有什么用呢? inspect internal webpack config 能快速地在控制台看到对应生成的 webpack 配置对象. 首先它是 ...
- 用Angule Cli创建Angular项目
Angular4.0来了,更小,更快,改动少 接下来为Angular4.0准备环境和学会使用Angular cli项目 1.环境准备: 1)在开始工作之前我们必须设置好开发环境 如果你的机器上还没有安 ...
- Vue CLI 创建项目
使用命令创建VUE项目 运行以下命令[vue create [项目名]]来创建一个新项目: vue create hello-world 警告 如果你在 Windows 上通过 minTTY 使用 G ...
- 使用vue/cli 创建一个简单的项目
首先,电脑安装了node.js官方要求8.9 或更高版本 (推荐 8.11.0+) npm install -g @vue/cli # OR yarn global add @vue/cli 全局安装 ...
随机推荐
- pcap的安装
pcap,即 packet capture library 抓包库,这个抓包库给抓包系统提供了一个高层次的接口.所有网络上的数据包,甚至是那些发送给其他主机的,通过这种机制,都是可以捕获的.它也支持把 ...
- 关于might_sleep的一点说明【转】
转自:http://blog.csdn.net/chen_chuang_/article/details/48462575 这个函数我在看代码时基本上是直接忽略的(因为我知道它实际上不干什么事),不过 ...
- RemoteBox 1.6 发布,VirtualBox 管理工具
RemoteBox 1.6 发布,VirtualBox 管理工具 http://www.lupaworld.com/article-230113-1.html 安装VirtualBox Extensi ...
- aspxgridview export导出数据,把true显示成‘是’
项目原因,数据库中的数据是‘true’还有‘false’,但是在页面上要显示为‘是否’,导出来的时候也是要显示成‘是否’ 要在web页面当中显示成‘是否’,只要在gridview的CustomColu ...
- The content of element type "resultMap" must match "(constructor?,id*,result*,association*,collectio
The content of element type "resultMap" must match "(constructor?,id*,result*,associa ...
- HIbernate学习笔记1 之 简介
一.Hibernate的概念 hibernate是数据访问层的框架,对JDBC进行了封装,是针对数据库访问提出的面向对象的解决方案.使用它可以直接访问对象,自动将此访问转换为SQL执行,从而达到间接访 ...
- 阿里云Centos等更新源设置成阿里源方法。
https://help.aliyun.com/knowledge_detail/5974184.html ---------------------------------------------- ...
- http请求数据的格式
最近看了tinyhttpd的服务器代理,看了看http请求数据包的格式和内容 http请求报包含三个部分: 请求行 + 请求头 + 数据体 请求行包含三个内容 method + request-URI ...
- Fel表达式使用过程中需要注意的问题
精度问题: 我们知道java中直接使用float和double参与的计算都可能会产生精度问题,比如0.1+0.3.1.0-0.9 等.所以一般财务系统,都会使用BigDecimal进行加减乘除. 在调 ...
- NativeScriptEngineService 被调用流程
AbsractSearchScritp 有个lookup! NativeScriptEngineService search()会调用 script.setLookup() NativeScriptE ...