安装Vue node 及 创建一个Vue 项目
安装Vue 和 node 及 创建一个Vue 项目
- 一 下载node.js安装包
- 1 下载资源包,然后安装
- 2 点击以上的Run(运行),将出现如下界面,然后一直点击Next 直达安装完成
- 3 检测PATH环境变量是否配置了Node.js,点击开始=》运行=》输入"cmd" => 输入命令"path",输出如下结果
- 4 检测node和npm 版本 输入指令 node --version 和 npm --version
- 二 安装vue
- 1 全局安装cli脚手架工具
- 三 创建一个vue项目
- 1 创建一个基于 webpack 模板的新项目
- 2 运行测试
一 下载node.js安装包
node官方网址
https://nodejs.org/en/download/
1 下载资源包,然后安装
2 点击以上的Run(运行),将出现如下界面,然后一直点击Next 直达安装完成
3 检测PATH环境变量是否配置了Node.js,点击开始=》运行=》输入"cmd" => 输入命令"path",输出如下结果
PATH=C:\oraclexe\app\oracle\product\10.2.0\server\bin;C:\Windows\system32;
C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0;
c:\python32\python;C:\MinGW\bin;C:\Program Files\GTK2-Runtime\lib;
C:\Program Files\MySQL\MySQL Server 5.5\bin;C:\Program Files\nodejs;
C:\Users\rg\AppData\Roaming\npm
C:\Program Files\nodejs\ 看到有关node代表路径没有问题了
4 检测node和npm 版本 输入指令 node --version 和 npm --version
二 安装vue
1 全局安装cli脚手架工具
vue之所以好用,这个脚手架工具有很大功劳,它帮助我们创建,打包项目,就是个小助手
npm install --global vue-cli (-global 意思是全局安装 这样Vue会安装到node 的文件夹下 否则会安装到 当前目录)
全局安装 vue-cli
过程中可能会有些警告但是是正常的,最后输入命令
vue --version 有版本显示则脚手架安装成功
顺带一提,在最新的cli3版本中vue的cli这个脚手架工具做出了可视化的图形工具,这里给大家看看
执行命令 vue ui 就可以啦
下面是它图像化的样子,许多依赖,插件在这里都可以直接下载安装,非常方便
三 创建一个vue项目
如果下载了cli3的同学,直接在它的图形化界面就可以创建了,下面讲讲怎么用命令行创建
1 创建一个基于 webpack 模板的新项目
vue init webpack my-project my-project(项目文件夹名)
然后出现一堆信息的填写,填完就好了
(项目名称)
(项目描述)
(作者)…
这里值得注意的是,==should we run npm install… ==(这句话是在问是否在工程创建后就去跑 npm 安装依赖 这里面有几个选项 第一个是【是】 也可以选最后一个 稍后自己就安装依赖 即 在命令行执行npm install 命令 ),一般建议选是就好了,因为后面也会用到
然后安装完成
2 运行测试
进入文件夹 执行运行命令
cd project2
npm run dev
然后打开浏览器就可以啦
安装Vue node 及 创建一个Vue 项目相关推荐
- 怎么样用vue ui来创建一个vue项目
1.在命令行中输入vue ui点击回车(前提是你的环境已经配置好了) 2.自动弹出一个网页,点击中间的创建分类栏目,并选择好文件夹目录 3.点击在此创建新项目 4.输入项目的名称点击下一步按钮 5.选 ...
- 第三节:创建一个Vue实例,超简单
最近事多,更新稍慢了点,距离第二节推送快一周了. 我们之前说过,Vue是数据驱动视图的,只要model(模型层)的数据改变了,Vue就会帮我们改变视图上显示的内容,不用我们自己去动手写代码更新.那么, ...
- 使用VSCode创建一个Vue项目
使用VSCode创建一个Vue项目 vue-cli 是vue.js的脚手架,用于自动生成vue.js模板工程的. 安装vue-cli之前,需要先安装了vue和webpack · node -v //( ...
- Vue.js 学习笔记十二:Vue CLI 之创建一个项目
目录 创建一个项目 创建一个项目 运行以下命令来创建一个新项目: vue create vuecli-demo 你会被提示选取一个 preset.你可以选默认的包含了基本的 Babel + ESLin ...
- 使用webpack脚手架创建一个vue项目
使用webpack脚手架创建一个vue项目 前言介绍 前期环境准备 开始创建项目 实例 交流 前言介绍 创建vue的项目方式有很多种,这里仅介绍使用webpack脚手架来创建一个vue项目,下面将创建 ...
- 如何创建一个vue项目
首先要准备好node.js npm,vue-cli 创建一个vue项目,使用脚手架创建具体命令如下 vue init webpack 项目名称 然后回车 Project name 项目名称 ( ...
- 从零开始创建一个vue项目 1
从零开始创建一个vue项目 创建空文件夹,存放相关目录,cmd进入命令行 vue init webpack token 创建项目(除eslint,其它都yes) 打包配置config下面的index. ...
- vue+node+mongodb 搭建一个完整博客
Vue + Node + Mongodb 开发一个完整博客流程 前言 前段时间刚把自己的个人网站写完, 于是这段时间因为事情不是太多,便整理了一下,写了个简易版的博客系统 服务端用的是 koa2框架 ...
- Babylonjs入门02——VsCode+vue+babylonjs开发第一个babylon项目程序
Babylonjs入门02--VsCode+vue+babylonjs开发第一个babylon项目程序 1 环境搭建 2 创建vue项目 3 基于vue项目写第一个babylon项目 4 下一期再见 ...
最新文章
- 834. Sum of Distances in Tree
- IDEA通过git怎么回滚到某个提交节点或某个版本
- 最悲剧的HTML5 API : Position地理位置
- 展示面-网络安全相关学习总结
- 储存字母 电子计算机,计算机基础_精简版
- oracle条件批量更新表数据
- [UOJ455][UER #8]雪灾与外卖——堆+模拟费用流
- java 子类调用父类内部类_java 如何在子类方法中实例化父类的内部类?
- linux搭建harbor与使用
- Floyd算法 求多源汇最短路
- 『矩阵论笔记』雅可比矩阵(Jacobian)和海森矩阵(Hessian)
- c语言及格率函数,求及格率的代码为什么不行。
- web服务器和app服务器
- mongoose用模型更新不了,因为模型对象中默认带有_id会提示errmsg: “Performing an update on the path ‘_id‘ would modify the i
- 编译优化之 - 通用循环优化
- getway 的session相关
- C语言实现模拟大乐透和双色球彩票机选【纯娱乐】
- java 罗马数字_JAVA,罗马数字与阿拉伯数字的互转
- 国科大学习资料--最优化计算方法(王晓)--期末考试试卷历年题按题型汇总
- 从MUD到MMO——虚拟世界发展简史以及未来可能性的杂谈