首先要明白Vue是基于node的,在公司要使用vue来开发项目的话肯定是要先安装node的,下面是搭建一个最简单的vue项目环境

一 安装node

这个可以去node的官网下载对应版本

安装好之后 cmd 中 输入 node -v 看是否安装好

二(可选)安装淘宝镜像cnpm

一般在第一步安装node时是自带给你把npm给安装了的(npm不懂的童鞋请自行百度),但我们通常会用cnpm,也就是淘宝镜像

因为用npm网速慢的话会很难受毕竟是国外的镜像

安装:可以在单个demo里面安装也可以全局安装命令都是一样的

在cmd命令行  输入 npm install -g cnpm --registry=https://registry.npm.taobao.org;

三 安装脚手架vue-cli

在安装好淘宝镜像后就可以安装脚手架了,

安装:在cmd命令中输入 cnpm install --global vue-cli   安装好可以输入 vue 检查信息

四 搭建项目

环境都搭好了,最后一步就是去搭建一个vue项目了

首先随便在你的工作空间中创建一个空目录,我这里创建的叫vuedemo,然后在vuedemo这个目录打开cmd,可以选中上面搜索框路径如下图我已经选了然后打cmd按回车就可以弹出命令行界面了

ok在弹出命令窗口后我们就可以开始初始化这个空文件夹了

输入命令 vue init webpack 项目名(myvue)

注意这里的项目名随便取,初始化完成后它会在vuedemo下生成一个 myvue的文件夹,初始化后的东西都在myvue目录下

接着按下上面的命令后就会出现一项一项的 选项,这里说明下

project name 是自己的demo名称 这里是myvue

project description 是默认的  A Vue.js project

author 是作者

vue bulid 一般选 standlone

最关键的是 下面的路由设置

install vue-router  选 y   一定要选 y  一定要安装这个的 !!!

还有eslint检测 可以选 y 这个看自己情况,它是一套检测规范很多大公司都在用,这里安装的话,项目里面也可以自己关闭的,我是安装了自己在项目里配置关掉的

其它几个安装选项 都可以不安装 选 n

五 启动项目

进入myvue文件夹,打开文件夹下的cmd,或者 cd  进入myvue  ,输入命令npm run dev 或者 cnpm run dev

启动完成后,cmd窗口中会有一个 localhost:xxxx 的url ,在浏览器打开这个 url 如果出现以下 页面,那么 恭喜你第一个 vue项目搭建成功了!

vue项目环境的搭建的更多相关文章

  1. Vue 项目环境搭建

    Vue项目环境搭建 ''' 1) 安装node 官网下载安装包,傻瓜式安装:https://nodejs.org/zh-cn/ 2) 换源安装cnpm >: npm install -g cnp ...

  2. vue项目环境搭建与组件介绍

    Vue项目环境搭建 """ node ~~ python:node是用c++编写用来运行js代码的 npm(cnpm) ~~ pip:npm是一个终端应用商城,可以换国内 ...

  3. 搭建vue项目环境

    前言 在开发本项目之前,我对vue,react,angular等框架了解,仅限于知道它们是什么框架,他们的核心是什么,但是并没有实际使用过(angular 1.0版本用过,因为太难用,所以对这类框架都 ...

  4. vue项目ide(vue项目环境搭建)

    一.先介绍一下我接下来要做的项目 项目:ide可视化工具 技术应用: Vue2.0(js框架):https://cn.vuejs.org/ ElementUi(饿了吗ui框架基于vue的):http: ...

  5. day66_10_10,vue项目环境搭建

    一.下载. 首先去官网查看网址. 下载vue环境之前需要先下载node,使用应用商城npm下载,可以将其下载源改成cnpm: """ node ~~ python:nod ...

  6. Vue项目环境搭建(node+webpack)

    安装node.js 下载地址:https://nodejs.org/en/download/ node -v //查看node.js版本 项目环境配置: 安装vue-cli:npm install - ...

  7. vue-cli搭建vue项目环境

    该篇文章是继https://www.cnblogs.com/qing-5/p/11321585.html来写 1.打开终端,输入指令"npm install --global vue-cli ...

  8. windows下vue开发环境的搭建

    一 介绍: vue.js是什么? Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库 ...

  9. vue项目环境搭建(webpack4从零搭建)--仅个人记录

    一.nodejs环境搭建 首先需要下载node.js(推荐直接官网找最新的版本),下载完成后会自带npm包管理工具,打开cmd命令行界面,输入npm -v .node -v检查node.js与npm是 ...

随机推荐

  1. Linux 系统信息查询大全

    Linux常用系统命令 # uname -a # 查看内核/操作系统/CPU信息 # head -n 1 /etc/issue # 查看操作系统版本 # cat /etc/redhat-release ...

  2. 修改Ubuntu屏幕的分辨率

      最近重新装了一下环境,用vnc连接服务器,发现分辨率过低,于是查了一下如何修改分辨率,将其调高.   编辑/etc/default/grub 搜索"#GRUB_GFXMODE=640x4 ...

  3. [转帖]phoronix-test-suite 简介

    <工作杂记>之phoronix-test-suite 2017年10月30日 14:32:52 打雷下雨 阅读数 2078更多 分类专栏: # linux   版权声明:本文为博主原创文章 ...

  4. H3C 交换机配置ssh登陆

    1.开启ssh服务,创建密钥. <D05-S5048-02>system-view [D05-S5048-02]ssh server enable //开启ssh服务 [D05-S5048 ...

  5. python爬取网页数据并存储到mysql数据库

    #python 3.5 from urllib.request import urlopen from urllib.request import urlretrieve from bs4 impor ...

  6. android中sqlite数据库的基本使用和添加多张表

    看了很多关于android使用sqlite数据库的文章,很多都是介绍了数据库的建立和表的建立,而表通常都是只建立一张,而实际情况我们用到的表可能不止一张,那这种情况下我们又该怎么办呢,好了,下面我教大 ...

  7. 查找最大和次大元素(JAVA版)(分治法)

    问题描述:对于给定的含有n个元素的无序序列,求这个序列中最大和次大的两个不同元素. 问题求解分析(分治法):先给出无序序列数组a[low...high].第一种情况为当数组中只有一个元素时,此时只存在 ...

  8. JavaScript Basics_Fundamentals Part 1_Variables

    JavaScript Variables JavaScript 变量(Variables)是用于存储数据值的容器. 创建一个 JavaScript 变量,可以使用关键字 let. Example le ...

  9. koa 实现session登陆

    在我们访问一些网站内部内容的时候,通常都会先验证我们是否已经登陆,如果登陆了就跳转到内容页面否则就跳转或者弹出登陆页面. 但是HTTP协议是没有状态的协议,无法标识一个用户的登录状态. 于是Cooki ...

  10. 在vue中引用echarts导致Cannot read property getAttribute of null ?

    报错信息如下: 之前一直用echarts没有出现过这个问题,所以当这个问题出现时我就开始了各种查,试了几种方法依旧报错,比如: 1.在mounted() {},写成如下形式:(依旧报错) this.$ ...