参考博客文章 博主FungLeo的Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版

注:原博主写的非常详细 本文章为根据原博主教程总结的自己的搭建流程

一、安装node环境

二、使用node -v以及npm -v查看版本号

三、安装vue-cli

npm install -g vue-cli

查看vue版本号(注:这里的-V的V必须为大写)

vue -V

四、使用vue-cli搭建项目

1.新建项目文件夹vueStudy

2.在vueStudy中打开git bash窗口

3.执行

vue init webpack vuedemo   

这是命令行会出现以下代码

? Project name (vueDemo)                   //输入项目名称 回车默认为vue init 时的vueDemo
? Project description A Vue.js project //输入项目描述
? Author yinshiru <yin1906901803@163.com> //输入作者
? Vue build standalone //需要不需要安装编译器,我选择需要安装
? Install vue-router? Yes //是否使用vue-router Y为使用N不使用
? Use ESLint to lint your code? (Y/n) //是否使用ESLint语法检查
? Set up unit tests No //是否使用unit测试 我没有用到选的是不选择
? Setup e2e tests with Nightwatch? No //是否使用e2e测试 我也没有用到选择的不使用

tip:出现如上图所示提示即为安装成功,这时我们可以看一下vueStudy文件下已经生成了vuedemo项目文件

按照终端给出的提示执行命令:

cd vueDemo      //进入项目文件夹
npm run dev //运行项目

执行成功如上图所示,在浏览器中输入localhost:8080页面出现如下图所示即为搭建成功

                                    。。。未完待续

vue全家桶(vue2.x+vue-router+axios+webpack)项目搭建的更多相关文章

  1. 从零开始系列之vue全家桶(4)带新手小白一起搭建第一个个人网站项目

    未经允许,严禁转载,全文由blackchaos提供. 在安装好了前面大部分需要的插件,我们开始进行第一个个人项目.结合vue+vuex+vue-cli+vue-router+webpack使用. 1. ...

  2. Vue 全家桶,深入Vue 的世界

    内容简介: Vue 实例上的属性 Vue 生命周期 Vue 数据绑定 computed 计算属性 watch 监听器 Vue 组件 Vue 组件 extend Vue 组件高级属性 Vue 的rend ...

  3. 【实战】Vue全家桶(vue + axios + vue-router + vuex)搭建移动端H5项目

    使用Vue全家桶开发移动端页面. 本博文默认已安装node.js. github链接 一.准备工作 安装vue npm install vue 安装脚手架vue-cli npm install -g ...

  4. vue全家桶+axios+jsonp+es6 仿肤君试用小程序

    vue全家桶+axios+jsonp+es6 仿肤君试用小程序 把自己写的一个小程序项目用vue来实现的,代码里面有一些注释,主要使用了vue-cli,vue,vuex,vue-router,axoi ...

  5. Nuxt + Vue 全家桶

    引子 情由无中有,一旦有了,便万劫不复 简介 “简单却不失优雅,小巧而不乏大匠”. Vue.js 是一个JavaScriptMVVM库,是一套构建用户界面的渐进式框架.它是以数据驱动和组件化的思想构建 ...

  6. 用 Vue 全家桶二次开发 V2EX 社区

    一.开发背景 为了全面的熟悉Vue+Vue-router+Vuex+axios技术栈,结合V2EX的开放API开发了这个简洁版的V2EX. 在线预览 (为了实现跨域,直接npm run dev部署的, ...

  7. Vue全家桶

    简介 “简单却不失优雅,小巧而不乏大匠”. Vue.js 是一个JavaScriptMVVM库,是一套构建用户界面的渐进式框架.它是以数据驱动和组件化的思想构建的,采用自底向上增量开发的设计. 为什么 ...

  8. 使用vue全家桶制作博客网站

    前面的话 笔者在做一个完整的博客上线项目,包括前台.后台.后端接口和服务器配置.本文将详细介绍使用vue全家桶制作的博客网站 概述 该项目是基于vue全家桶(vue.vue-router.vuex.v ...

  9. 转载: 使用vue全家桶制作博客网站 HTML5 移动网站制作的好教程

    使用vue全家桶制作博客网站   前面的话 笔者在做一个完整的博客上线项目,包括前台.后台.后端接口和服务器配置.本文将详细介绍使用vue全家桶制作的博客网站 概述 该项目是基于vue全家桶(vue. ...

  10. Vue全家桶介绍

    一直不清楚全家桶是什么玩意,上网搜了一下,才知道就是平时项目中使用的几个依赖包,下面分享一下 Vue 全家桶介绍 Vue有著名的全家桶系列,包含了vue-router(http://router.vu ...

随机推荐

  1. eclipse远程调试Tomcat方法(转)

    转自:http://blog.csdn.net/afgasdg/article/details/9236877 1.Linux中配置tomcat在catalina.sh中添加如下CATALINA_OP ...

  2. Linux下的上传和下载yum install -y lrzsz

    先使用命令 yum install -y lrzsz rz 上传    或者直接拖动 sz 要下的文件 回车

  3. js实用小函数收集

      格式化金额 var val='212312.235423' var rex = /\d{1,3}(?=(\d{3})+$)/g; val.replace(/^(-?)(\d+)((\.\d+)?) ...

  4. Jquery中的offset()和position()深入剖析(元素定位)

    先看看这两个方法的定义. offset(): 获取匹配元素在当前视口的相对偏移. 返回的对象包含两个整形属性:top 和 left.此方法只对可见元素有效. position(): 获取匹配元素相对父 ...

  5. 大碗宽面Alpha冲刺阶段博客目录

    大碗宽面Alpha冲刺阶段博客目录 一.Scrum Meeting 1. [第六周会议记录]第六周链接 2. [第七周会议记录]第七周链接 二.测试报告 [alpha阶段测试报告](博客链接) ## ...

  6. 爬虫问题之Unknown command: crawl

    出现这个问题,很大原因是爬虫没有在项目文件夹里运行,因为scrapy 这个爬虫框架封装好的一些命令,必须在框架内环境支持下才能运行 另外在环境目录下,还有很多命令,也必须在此路径环境下才能执行 可以通 ...

  7. flask中app.py: error: invalid choice: 'insert'........的问题

    在flask中,分为两种操作方式,url指向函数或者终端指向函数,最终目的就是让函数执行,触发方式不同.终端执行更加安全, 另外如果在终端执行的时候出现 : 就是说明 insert 没有在@ mana ...

  8. QC浏览器登陆自动关闭

    服务器(win2003 SP2)上装了个QC10,用了一段时间后突然登陆不上了.可以看见域及Project信息,但是登陆后加载几秒后突然自动关闭.局域网内的其他机器可以登陆. 解决方案:修改数据执行保 ...

  9. 【IO流】java中文件路径(相对路径、绝对路径)相关类及方法

    原文链接:https://blog.csdn.net/Activity_Time/article/details/98034409 1. URL 菜鸟教程:Java URL处理 通常推荐对http等协 ...

  10. PAT甲级——A1145 HashingAverageSearchTime【25】

    The task of this problem is simple: insert a sequence of distinct positive integers into a hash tabl ...