github上项目地址:https://github.com/comonly/javaweb_blog/tree/master/blog_diverse_frontend

具体搭建流程及实现方式:http://comonly.cn/p/1129.html

项目内容

1. 项目通过:vue init webpack project-name 自动构建。
2. 使用 axios 异步请求数据。
3. 样式使用 ElementUI。

实现流程

  1. 利用vue-cli来搭建vue项目——通过npm创建一个vue项目:http://comonly.cn/p/1030.html
  2. src目录main.js文件中配置需要用到的工具。
  3. 同时要在 package.json 文件中添加需要的 模块 。
  4. 接着在src/components目录下创建组件。
  5. 然后在src/router目录下添加路由。

vue项目搭建通过vue-cli包括组件路由的使用实现基本的前端项目全流程的更多相关文章

  1. vue2.0 项目搭建 和vue 2.0 electron 项目搭建

    1.关于electron vue 项目的搭建 全局或者局部安装项目vue: 脚手架指令生成: npm install -g vue-cli vue init simulatedgreg/electro ...

  2. ASP.NET Core 实战:使用 ASP.NET Core Web API 和 Vue.js 搭建前后端分离项目

    一.前言 这几年前端的发展速度就像坐上了火箭,各种的框架一个接一个的出现,需要学习的东西越来越多,分工也越来越细,作为一个 .NET Web 程序猿,多了解了解行业的发展,让自己扩展出新的技能树,对自 ...

  3. List多个字段标识过滤 IIS发布.net core mvc web站点 ASP.NET Core 实战:构建带有版本控制的 API 接口 ASP.NET Core 实战:使用 ASP.NET Core Web API 和 Vue.js 搭建前后端分离项目 Using AutoFac

    List多个字段标识过滤 class Program{  public static void Main(string[] args) { List<T> list = new List& ...

  4. 从零搭建基于webpack的Electron-Vue3项目(1)——基于webpack的Vue3项目搭建

    从零搭建基于webpack的Electron-Vue3项目(1)--基于webpack的Vue3项目搭建 前言 本篇文章内容,主要是基于webpack的Vue3项目开发环境进行搭建,暂时还不涉及到El ...

  5. 从零开始搭建框架SSM+Redis+Mysql(二)之MAVEN项目搭建

    从零开始搭建框架SSM+Redis+Mysql(二)之MAVEN项目搭建 废话不说,直接撸步骤!!! 1.创建主项目:ncc-parent 选择maven创建项目,注意在创建项目中,packing选择 ...

  6. 004-Spring boot 快速入门-项目搭建与启动、SpringBootApplication、启动图标

    一.官方地址 Spring:http://spring.io/ Spring Project:http://spring.io/projects Spring boot:https://project ...

  7. VUE系列一:VUE入门:搭建脚手架CLI(新建自己的一个VUE项目)

    一.VUE脚手架介绍 官方说明:Vue 提供了一个官方的 CLI,为单页面应用快速搭建 (SPA) 繁杂的脚手架.它为现代前端工作流提供了 batteries-included 的构建设置.只需要几分 ...

  8. Vue框架(三)——Vue项目搭建和项目目录介绍、组件、路由

    Vue项目环境搭建 1) 安装node,在官网下载好,然后在本地安装 官网下载安装包,傻瓜式安装:https://nodejs.org/zh-cn/ 2) 换源安装cnpm >: npm ins ...

  9. Vue环境搭建-项目的创建-启动生命周期-组件的封装及应用

    vue项目环境的搭建 """ node >>> python:node是用c++编写用来运行js代码的 npm(cnpm) >>> p ...

随机推荐

  1. sqlserver 两 表 数据 复制 (附加 跨服务器 查询的方法)

    一 : 这个sql 语句 可以快速的 将 一 个旧表 中的指定字段的数据 复制到 另一个新表的指定字段中 insert into dbo.Customer ( CustomerId , Custome ...

  2. ZR#999

    ZR#999 解法: 一道计数题,看到要求必须 $ m $ 个标号,所有标号至少出现一次的方案. 很容易想到可以容斥,但容斥这个东西是一种很神奇的东西,你可以看出来一道题需要容斥,但你就是不知道怎么容 ...

  3. Hadoop 安装(本地、伪分布、分布式模式)

    本地模式 环境介绍 一共三台测试机 master   192.168.4.91 slave1   192.168.4.45 slave2   192.168.4.96 操作系统配置 1.Centos7 ...

  4. mysql全面优化

    在进行MySQL的优化之前,必须要了解的就是MySQL的查询过程,很多查询优化工作实际上就是遵循一些原则,让MySQL的优化器能够按照预想的合理方式运行而已. 图-MySQL查询过程 一.优化的哲学 ...

  5. git submodule 如何push代码

    某git项目关联了一个submodule 如何更新该项目下的submodule https://stackoverflow.com/questions/5814319/git-submodule-pu ...

  6. keras输出预测值和真实值

    在使用keras搭建神经网络时,有时需要查看一下预测值和真是值的具体数值,然后可以进行一些其他的操作.这几天查阅了很多资料.好像没办法直接access到训练时的数据.所以我们可以通过回调函数,传入新的 ...

  7. SQL-W3School-函数:SQL COUNT() 函数

    ylbtech-SQL-W3School-函数:SQL COUNT() 函数 1.返回顶部 1. COUNT() 函数返回匹配指定条件的行数. SQL COUNT() 语法 SQL COUNT(col ...

  8. android 上下滑动标题栏和状态栏改变颜色实现

    import android.content.Context; import android.util.AttributeSet; import android.widget.ScrollView; ...

  9. AppCompatTextView可改变文本字体大小

    有这样一个需求,要求在一个列表中的每个条目中展示字数不限个数的文本.而且每个条目的宽度都是固定的,展示的文本如果过长,不可以用省略号显示,只能动态的调整(缩小)文本的字号来达到文本能完全显示的效果,而 ...

  10. Qt编写自定义控件57-直方波形图

    一.前言 直方波形图控件非原创控件,控件大全中大概有20-30个控件非自己原创,而是参考了网上开源的代码,自己加以整理和完善,新增了插件的代码使得可以直接集成到QtDesigner或者QtCreato ...