Vue搭建一个项目

用Vue搭建一个项目

Vue.js 不支持 IE8 及其以下版本,因为 Vue.js 使用了 IE8 不能模拟的 ECMAScript 5 特性。 Vue.js 支持所有兼容 ECMAScript 5 的浏览器。

安装环境:

第一步:安装  node>js

在这个网站下载适合自己电脑的安装包。然后跟着安装步骤一步一步安装。http://www.cnblogs.com/zzuIvy/p/nodejs_1.html

然后安装好之后需要检查下。

检查是否安装在窗口搜索  cmd

然后输入  node -v  下面出来版本号的话,就说明安装成功了。

第二步:安装 淘宝镜像

01.   npm install -g cnpm --registry=https://registry.npm.taobao.org

02.   cnpm install cnpm -g

这时候已经安装好了。检查是否安装用  cnpm -v

下面出来

就说明已经安装好了。

第三步:安装 Vue

第一种:

01. 如果使用淘宝镜像安装就输入命令行

cnpm install -g vue-cli进行安装

02. 如果没有安装淘宝镜像依旧用

npm install -g vue-cli安装

第二种:

01.  cnpm install vue(安装Vue)

检查: vue -V  出来版本号就说明成功了

第四步: 安装Vue-cli

cnpm install --global vue-cli(安装Vue-cli)或者 npm install --global vue-cli

此时环境就搭建好了。

01.接下来我们需要指定一个目录存放我们的项目,可以选择任意路径,确定好路径后输入下面的命令

vue init webpack "项目名称"

不清楚这些是什么,但是我都选择了YES 没有选择NO。不过都选择了Y。运行了好长的时间。可以适当的选择N。可以按着第二张图片选择Y或者N

然后就会出来上面图片的的这个三步,跟着这个步骤一步一步做。

因为运行的时间好长,我就中途关闭了。这时候看项目,会出来如下的

一步一步进行,进行不下去就解决报错。

我运行的时候,就是 npm(cnpm) 的版本过低。因为安装Vue需要npm的版本大于3.0.0,所以我们要升级一下。升级npm 版本:

cnpm install cnpm -g  或者  npm install npm -g

最后进行: npm run dev  出现  http://localhost:8080/  就大功告成了。

时间: 2024-08-02 20:11:58

Vue搭建一个项目的相关文章

vue - 新建一个项目

首先: 要先安装node 及 npm Node.js官方安装包及源码下载地址:http://nodejs.org/ 双击安装,在安装界面一直Next 直到Finish完成安装. 打开控制命令行程序(CMD),检查是否正常 使用淘宝NPM镜像 大家都知道国内直接使用npm 的官方镜像是非常慢的,这里推荐使用淘宝 NPM 镜像. $  npm  install  -g  cnpm  --registry=https://registry.npm.taobao.org 这样就可以使用cnpm 命令来安

搭建一个项目的前期准备

后端:node(驱动) + mogodb(数据库) + express(node框架) + mongoose(快速建模工具) + moment.js(时间和日期格式化) + jade(模板引擎) 前端: jquery(类库) + bootstrsop(样式框架) + bower(npm模块) 本地环境:less + cssmin + jshint + uglifyjs + mocha + grunt(集成前面的) 实战步骤 1.需求分析:看一下有哪些页面,页面有哪些内容,有什么样的交互,这样做到

浅谈如何搭建一个项目,初学者对于架构程序的理解

经过坚持不懈的努力,终于学到了软件建模的部分,对于java的理解,也有了更深入的理解,首先,软件建模就是把软件的概念抽象出来,然后,建立成一个单独存取属性的类,比如说,你想做一个网站,大家都知道网站有很多题头,就像首页.内容.摘要.新闻,这些字段,就是网页抽象出的属性,而我们把他们抽象出来,封装成一个类,来对它进行控制,这个控制在java中叫做javabean,javabean就是建立一个都是属性(id,name,age,address)这样一个有getter和setter,实现序列化,有默认构

使用Vue脚手架(vue-cli)从零搭建一个vue项目

注:在搭建项目之前,请先安装一些全局的工具(如:node,vue-cli等) node安装:去node官网(https://nodejs.org/en/)下载并安装node即可,安装node以后就可以正常使用npm命令 全局安装vue-cli工具:npm install vue-cli -g 开始创建项目: 找一个合适的位置,打开命令窗口,使用vue初始化基于webpack的新项目 vue init webpack vue-demo //注意名称太长的话它会有错误提示,就像VueDemo 我们可

抛开vue-cli 利用requireJS搭建一个vue项目

---恢复内容开始--- 现在学习vue都是利用脚手架vue-cli快速搭建一个项目,这是非常高效的方法,我是十分推荐的,但是有时候在没有互联网的情况,我们没办法在node环境下,敲一个nmp install XXX帮我们搭建系统.这边也遇到了这样的情况,记录一下过程,备忘. 采用的方式是利用requireJS搭建一个遵循AMD规则的vue项目.关于这一块,大家可以百度一下,查询相关资料熟悉requireJS的使用. 第一步,都是建立一个如下常规的简单的工程结构: ----lib 存放js库文件

vue-用Vue-cli从零开始搭建一个Vue项目

Vue是近两年来比较火的一个前端框架(渐进式框架吧). Vue两大核心思想:组件化和数据驱动.组件化就是将一个整体合理拆分为一个一个小块(组件),组件可重复使用:数据驱动是前端的未来发展方向,释放了对DOM的操作,让DOM随着数据的变化自然而然的变化(尤神原话),不必过多的关注DOM,只需要将数据组织好即可.本文用Vue-cli从零开始搭建一个Vue项目. 准备工作 1.下载安装Node.js 下载地址:https://nodejs.org/en/download/ ,选择合适自己的版本下载即可

使用vue-cli脚手架自动化搭建一个vue项目

最近在学习使用vue,简单汇总下如何使用vue-cli脚手架自动化搭建一个vue项: 1.首先,要安装node.js,之后第一步检测是否安装node:没有安装node的同学请到官网下载安装 https://nodejs.org/en/download/ 安装成功后在命令行查看node版本,如果有说明安装成功. 2.之后全局安装vue-cli脚手架 电脑进入cmd,任意路径下 使用 npm命令:npm install vue-cli -g 注意:npm -v 3.0+   npm版本需要在3.0之

完整搭建一个vue项目

目录 一. 搭建一个vue项目的完整步骤 二. 卸载vue-cli 三. 完全卸载webpack 一. 搭建一个vue项目的完整步骤 1.安装node.js 下载地址 # 检查是否安装成功 node -v npm -v 2.为了提高下载效率,可以使用淘宝镜像 # 淘宝镜像 npm install -g cnpm -registry=https://registry.npm.taobao.org # 检查是否安装成功 cnpm -v 3.安装webpack打包工具 webpack中文文档 npm

如何搭建一个vue项目(完整步骤)

参考资料 一.安装node环境 1.下载地址为:https://nodejs.org/en/ 2.检查是否安装成功:如果输出版本号,说明我们安装node环境成功 3.为了提高我们的效率,可以使用淘宝的镜像:http://npm.taobao.org/ 输入:npm install -g cnpm –registry=https://registry.npm.taobao.org,即可安装npm镜像,以后再用到npm的地方直接用cnpm来代替就好了. 检查是否安装成功: 二.搭建vue项目环境 1