1、脚手架vue-cli安装

npm install -g vue-cli

(npm init -f  生成package.json文件)

vue init webpack myapp

cd myapp

npm install

npm run dev

2、资源准备,目录设计

3、项目中的问题及解决方案
  ①定义全局方法:(在入口页面定义)

Vue.prototype.$loading = {
method: this.showProgress
};
方法调用:this.$loading.method  ②查询具体ID或类名的元素
document.querySelectorAll('.name #id')[0]  //查询到的结果为数组
												

基于vue的实战步骤的更多相关文章

  1. 详细记录vue项目实战步骤(含vue-cli脚手架)

    一.通过vue-cli创建了一个demo. (vue-cli是快速构建这个单页应用的脚手架,本身继承了多种项目模板:webpack(含eslit,unit)和webpack-simple(无eslin ...

  2. 「免费开源」基于Vue和Quasar的前端SPA项目crudapi后台管理系统实战之自定义组件(四)

    基于Vue和Quasar的前端SPA项目实战之序列号(四) 回顾 通过上一篇文章 基于Vue和Quasar的前端SPA项目实战之布局菜单(三)的介绍,我们已经完成了布局菜单,本文主要介绍序列号功能的实 ...

  3. 基于 Vue.js 之 iView UI 框架非工程化实践记要 使用 Newtonsoft.Json 操作 JSON 字符串 基于.net core实现项目自动编译、并生成nuget包 webpack + vue 在dev和production模式下的小小区别 这样入门asp.net core 之 静态文件 这样入门asp.net core,如何

    基于 Vue.js 之 iView UI 框架非工程化实践记要   像我们平日里做惯了 Java 或者 .NET 这种后端程序员,对于前端的认识还常常停留在 jQuery 时代,包括其插件在需要时就引 ...

  4. vue项目实战

    本篇文章主要介绍了vue的环境配置,vue项目的目录结构以及在开发vue项目中问题的一些解决方案. 环境配置及目录结构 1.安装node.js(http://www.runoob.com/nodejs ...

  5. 从开发一款基于Vue技术栈的全栈热重载生产环境脚手架,我学到了什么

    浏览文章前 这一期,我分享给大家三点看源码的小技巧,这也是从别的大佬那总结的. 被反复使用的代码 这样的代码是一个软件的重点函数,一个大神的写法有很多精华值得学习. 穿越时间的代码 如果一段代码10年 ...

  6. [vue最新实战] gank客户端(vue2 + vue-router2 + vuex +webpace + es6)新手福利,干货多多

    vue-meizi 本项目是基于vue2最新实战项目,是适合新手进阶的绝佳教程.代码简单易懂,注释多多.实现了移动端使用最多的 无限滚动,图片加载,左右滑动,等待.先发布预览版本,后面更多更全的功能和 ...

  7. 发布自己第一个npm 组件包(基于Vue的文字跑马灯组件)

    一.前言 总结下最近工作上在移动端实现的一个跑马灯效果,最终效果如下: 印象中好像HTML标签的'marquee'的直接可以实现这个效果,不过 HTML标准中已经废弃了'marquee'标签 既然HT ...

  8. 基于 Vue.js 之 iView UI 框架非工程化实践记要

    像我们平日里做惯了 Java 或者 .NET 这种后端程序员,对于前端的认识还常常停留在 jQuery 时代,包括其插件在需要时就引用一下,不需要就删除.故观念使然,尽管 Nuget 和 Maven ...

  9. webpack+vue项目实战(四,前端与后端的数据交互和前端展示数据)

    地址:https://segmentfault.com/a/1190000010063757 1.前言 今天要做的,就是在上一篇文章的基础上,进行功能页面的开发.简单点说呢,就是与后端的数据交互和怎么 ...

随机推荐

  1. 队列ADT

    队列 队列是FIFO表,使用队列时在队尾(rear)插入元素,称之为入队(enqueue),以及在对头(front)删除并返回元素值,称之为出队(dequeue). 任何表的实现都可以用于实现队列结构 ...

  2. AR(I)MA时间序列建模过程——步骤和python代码

    https://www.jianshu.com/p/cced6617b423 https://zhuanlan.zhihu.com/p/35282988 https://zhuanlan.zhihu. ...

  3. KVM 通过virsh console连入虚拟机

    新安装一台虚拟机后,是无法通过virsh console 命令连入虚拟机中的,这时我们需要开启虚拟机的console功能. 一.添加ttyS0的许可,允许root登陆 [root@localhost ...

  4. 4A Watermelon

    A. Watermelon time limit per test 1 second memory limit per test 64 megabytes input standard input o ...

  5. Java笔记 #05# Java Native Interface

    参考资料:http://www.ntu.edu.sg/home/ehchua/programming/java/javanativeinterface.html(很详细) 看jdk源代码时,经常会看到 ...

  6. Flutter之MaterialApp使用详解

    来自: https://cloud.tencent.com/developer/article/1337184 字段 类型 navigatorKey(导航键) GlobalKey<Navigat ...

  7. flutter key

    随意点开一个Widget,就会发现,可以传递一个参数Key.那这个Key到底是干啥子,有什么用呢? Flutter是受React启发的,所以Virtual Dom的diff算法也参考过来了(应该是略有 ...

  8. Python Kivy writes / read the file on the SD card

    Path to SD card from jnius import autoclass # SDcard Android # Get path to SD card Android try: Envi ...

  9. bind 笔记

    BIND 的安装和配置: dns 服务,程序包名为bind ,程序名称为named 只需要安装 bind ,bind-libs ,bind-utils 生产环境全部安装 bind 服务脚本 :/etc ...

  10. Codeforces Round #466 (Div. 2) -A. Points on the line

    2018-02-25 http://codeforces.com/contest/940/problem/A A. Points on the line time limit per test 1 s ...