从零搭建vue
第一步:
安装node.js,一般安装

长期维护版 相对比较稳定
点击下载,下载好了之后双击运行,可选择安装路径,然后一路下一步即可。
安装完成后,在cmd输入
node -v
如果出现版本号,则安装成功。
第二步:
安装npm:
一般安装好nodejs的同时,npm也安装好了。
cmd输入
npm -v
出现版本号,即npm安装成功。
但是毕竟npm不是国产的,网速上偶尔会受到影响,保险起见,在安装一个淘宝镜像cnpm
cmd输入
npm install -g cnpm --registry=https://registry.npm.taobao.org
安装完成后,cmd输入
cnpm -v
显示这么一坨,即为安装成功

第三步:
安装vue脚手架:
在cmd输入
cnpm install --global vue-cli
安装的时候是这样的

安装完成之后,cmd输入
vue
显示操作提示,即为安装成功

磨刀不误砍柴工,以上是磨刀阶段,刀磨好了,试试我刀磨的利否。
-------------------------------试刀分割线---------------------------------------------
新建一个vue项目,测试一下是否可以正常使用vue。
第一步,先创建一个vue项目,因为vue的相关依赖下载后很大是,所以建议不要放在c盘,可以学eclipse一样,建立一个工作空间,
我的工作空间是:E:\lzh\cdq\JavaScript\jiaoShouJia,打开cmd命令窗口,进入到目录下,然后我们开始创建新的项目输入命令:
vue init webpack test
然后,一直回车,直到提示,是否安装vue-router

输入y
会提示 js语法检测了解一下?先不需要,输入n

后面的都n

第二步,进入到test项目中

因为各个模板之间都是相互依赖的,所以现在我们要安装依赖,输入命令
cnpm install

第三步,我们试运行下,测试我们的工作空间是否可以正常使用,输入运行命令
npm run dev
显示这样,就大功告成了

cmd命令窗不要关闭,去浏览器输入http://localhost:8080显示下图

至此,整个测试项目搞定!赶快庆祝一下吧~
从零搭建vue的更多相关文章
- 初探webpack之从零搭建Vue开发环境
初探webpack之搭建Vue开发环境 平时我们可以用vue-cli很方便地搭建Vue的开发环境,vue-cli确实是个好东西,让我们不需要关心webpack等一些繁杂的配置,然后直接开始写业务代码, ...
- 从零搭建Vue开发环境
参考: 1.node安装和环境配置:https://www.cnblogs.com/zhouyu2017/p/6485265.html: 2.babel的安装:https://www.cnblogs. ...
- 从零搭建vue+express开发环境
1.express,vue运行环境,2建express项目,3建vue项目,4将vue项目(3)输出文件拷贝到express静态根目录里 一:---------PC全局安装express 和 vue- ...
- 使用vue+webpack从零搭建项目
vue到现在已经成为一个热门的框架,在项目实践当中,如果想要创建一个新项目,通常都会使用vue-cli的脚手架工具,毋容置疑能够方便很多,很多东西也不需要自己亲自去配置.都知道,脚手架其实是vue结合 ...
- webpack4搭建Vue开发环境笔记~~持续更新
项目git地址 一.node知识 __dirname: 获取当前文件所在路径,等同于path.dirname(__filename) console.log(__dirname); // Prints ...
- 从零搭建基于webpack的Electron-Vue3项目(1)——基于webpack的Vue3项目搭建
从零搭建基于webpack的Electron-Vue3项目(1)--基于webpack的Vue3项目搭建 前言 本篇文章内容,主要是基于webpack的Vue3项目开发环境进行搭建,暂时还不涉及到El ...
- windows环境下搭建vue+webpack的开发环境
前段时间一直在断断续续的看vue的官方文档,后来就慢慢的学习搭建vue的开发环境,已经有将近两周了,每到最后一步的时候就会报错,搞的我好郁闷,搁置了好几天,今天又接着搞vue的开发环境,终于成功了.我 ...
- 【原创】windows下搭建vue开发环境+IIS部署
[原创]win10下搭建vue开发环境 如果要转发,请注明原作者和原产地,谢谢! 特别说明:下面任何命令都是在windows的命令行工具下进行输入,打开命令行工具的快捷方式如下图: 详细的安 ...
- 初次搭建vue环境(最基础的)
一直以来觉得搭建环境是自己的短板,恰巧老大跟我说他刚才面试一个有4年工作经验的人,给那面试的人出了到机试题,给了1小时的时间连环境都没搭好.且不说那人的工作经验是否掺有水分,自己还是有点尴尬的,以前的 ...
随机推荐
- 最大子序列和问题--时间复杂度O(NlogN)
最大子序列和问题--时间复杂度O(NlogN) package a; /* * 最大子序列和问题,时间复杂度O(NlogN) */ public class Sequence { private st ...
- 内部类 ( Inner Class )
内部类的作用: 1.隐藏内部实现,高内聚. 2.Java多继承的实现. 何为Java的多继承? Java只支持单一继承,所以如果需要多继承,那么可用内部类来实现. 如何实现? 1.父类A public ...
- Lucas定理及扩展
Lucas定理 不会证明... 若\(p\)为质数 则\(C(n, m)\equiv C(n/p, m/p)*C(n\%p, m\%p)(mod\ p)\) 扩展 求 \(C(n,m)\) 模 \(M ...
- MUI框架-07-HBuilder+夜神安卓模拟器
MUI框架-07-HBuilder+夜神安卓模拟器 有时候我们在 HBuilder 里面 web 浏览器预览我们的 MUI 项目界面时,总感觉这个 web 浏览器随便拖拉比例,大小可调,但它毕竟是浏览 ...
- 安卓app开发-03-项目的基本开发步骤
android项目的基本开发步骤 这里分享一下开发 安卓 app 的流程,当然有些感觉不必要,其实不然,前期工作也是极为重要的额,就像开发的时候如果目标不对的话,到后期后很迷的,所以一定要提前做好规划 ...
- CountDownTimer的用法及原理
1.主线程中使用 值得注意的是,CountDownTimer可以在主线程中直接使用.验证一下回调的执行线程.在主线程中执行如下代码 CountDownTimer countDownTimer = , ...
- selenium元素定位方法
一.如何找到页面元素 Webdriver的findElement方法可以用来找到页面的某个元素,最常用的方法是用id和name查找.下面介绍几种比较常用的方法. 1.1By ID 假设页面写成这样:i ...
- 2 pygraphviz在windows10 64位下的安装问题(反斜杠的血案)
可以负责任的说,这篇文档是windows10安装pygraphviz中,在中文技术网站中最新的文档,没有之一.是自己完全结合各种问题,包括调试等,总结出来的. 问题来源:主要是可视化RvNN网络的树结 ...
- flask代码统计作业
用户表: create table userInfo( id int not null unique auto_increment, name )not null, password ) not nu ...
- 类型安全的EventHandlerList
我们写一个类时,有时候会在同一个类上添加很多事件,事件很多的话,是不容易管理的,.NET提供的EventHandlerList可以辅助多个事件的管理,但不方便的地方是,它不是类型安全的,缺少类型安全, ...