参考博客文章 博主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. json书写格式

    1.数组方式 [ ] [{ "id" : 1 , "name" : "xiaoming" },{ "id" : 2 , ...

  2. Windows最值得安装的小众软件

    用电脑这么久,也琢磨出自己的一些使用心得.今天和大家分享几个Windows效率工具.数量不多,但每个都是精品. ▌软件下载-卫星公众好「悦享软件」,在后台会话框中回复关键字:h108 1.Ditto ...

  3. JMeter 阶梯式加压测试插件 Stepping Thread Group

    在日常性能测试过程中,有时需要对被测对象不断的增加压力,直至达到某个值后,并持续运行一段时间.这里将借助jmeter插件模拟这种情况. 本文介绍在jmeter中,使用插件Stepping Thread ...

  4. Sqli labs系列-less-5&6 报错注入法(上)

    在我一系列常规的测试后发现,第五关和第六关,是属于报错注入的关卡,两关的区别是一个是单引号一个是双引号...当然我是看了源码的.... 基于报错注入的方法,我早就忘的差不多了,,,我记的我最后一次基于 ...

  5. 前端每日实战:71# 视频演示如何用纯 CSS 创作一个跳 8 字型舞的 loader

    效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/gKNMMm 可交互视频 此视频是可 ...

  6. 网页实时聊天之PHP如何实现websocket

    网页实时聊天之PHP如何实现websocket 一.总结 一句话总结: 应用 PHP 的 socket 函数库:PHP 的 socket 函数库跟 C 语言的 socket 函数非常类似 PHP 实现 ...

  7. Use Git Credential Managers to Authenticate to Azure Repos

    https://docs.microsoft.com/en-us/azure/devops/repos/git/set-up-credential-managers?view=azure-devops ...

  8. cs224d 作业 problem set2 (一) 用tensorflow纯手写实现sofmax 函数,线性判别分析,命名实体识别

    Hi Dear Today we will use tensorflow to implement the softmax regression and linear classifier algor ...

  9. 使用JQuery对页面进行绑值

    使用JQuery对页面进行绑值 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"&g ...

  10. Struts1.3——登录案例的改进

    在上篇写的用户登录验证案例的基础上进一步改进. 1.在登录成功后的welcome.jsp页面显示登录成功的用户名 思路1:在LoginAction中,将username放入request的域对象中 因 ...