zoukankan      html  css  js  c++  java
  • vue全家桶(vue2.x+vue-router+axios+webpack)项目搭建

    参考博客文章 博主FungLeo的Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版
    注:原博主写的非常详细 本文章为根据原博主教程总结的自己的搭建流程

    一、安装node环境

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

    查看node版本号

    三、安装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页面出现如下图所示即为搭建成功

    这里写图片描述

                                        。。。未完待续
    
  • 相关阅读:
    How many ways
    HDOj-1016 Prime Ring Problem
    DHU-1241 Oil Deposits
    Red and Black
    HDU-3790 最短路径问题
    vim/Gvim配置
    lintcode431- Connected Component in Undirected Graph- medium
    lintcode120- Word Ladder- medium
    lintcode531- Six Degrees- medium- microsoft
    lintcode624- Remove Substrings- medium
  • 原文地址:https://www.cnblogs.com/yinshiru/p/9594933.html
Copyright © 2011-2022 走看看