开始项目之前,先了解如何创建项目: http://www.cnblogs.com/pearl07/p/6247389.html

1,项目目录结构(路由是后来建的,将在下一篇使用路由,此处可忽略)。

2,首先完善main.js。

3,在components下 ,新建一个first.vue组件,并实现基本功能(模板、script和样式)

----此处应该先了解vue.js 2.0基本语法  http://cn.vuejs.org/v2/guide/

4,在app.vue中引入并使用自己创建的组件。

5,npm run dev  打开 http://localhost:8080/可看到如下效果。

vue-cli 组件的使用的更多相关文章

  1. 如何使用@vue/cli 3.0在npm上创建,发布和使用你自己的Vue.js组件库

    译者按: 你可能npm人家的包过成千上万次,但你是否有创建,发布和使用过自己的npm包? 原文: How to create, publish and use your own VueJS Compo ...

  2. 使用Vue CLI 3将基于element-ui二次封装的组件发布到npm

    前言:之前在网上找的好多都是基于vue-cli 2.x的,而使用vue-cli 3的文章比较少,Vue CLI 3 中文文档,所以我在自己尝试的时候把几篇文章结合了一下,调出来了我想要的模式,也就是V ...

  3. Vue CLI 3+tinymce 5富文本编辑器整合

    基于Vue CLI 3脚手架搭建的项目整合tinymce 5富文本编辑器,vue cli 2版本及tinymce 4版本参考:https://blog.csdn.net/liub37/article/ ...

  4. vue cli 3

    介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统 通过 @vue/cli 搭建交互式的项目脚手架. 通过 @vue/cli + @vue/cli-service-global 快 ...

  5. 16款优秀的Vue UI组件库推荐

    16款优秀的Vue UI组件库推荐 Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司的Web前端项目开发中,多个项目采用基 ...

  6. 【1】vue/cli 3.0 脚手架 及cube-ui 安装

    安装 Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+).你可以使用 nvm 或 nvm-windows在同一台电脑中管理多个 Node 版本. 检查node版本: $ ...

  7. 浅尝Vue.js组件(一)

    本篇目录: 组件名 组件注册 全局注册 基础组件的自动化全局注册 局部注册 在模块系统中局部注册 Prop 单向数据流 Prop验证 类型检查 非Prop特性 替换/合并已有的特性 禁用特性继承 自定 ...

  8. vue cli+axios踩坑记录+拦截器使用,代理跨域proxy(更新)

    16319 1.首先axios不支持vue.use()方式声明使用,看了所有近乎相同的axios文档都没有提到这一点建议方式 在main.js中如下声明使用 import axios from 'ax ...

  9. vue cli+axios踩坑记录+拦截器使用,代理跨域proxy

    1.首先axios不支持vue.use()方式声明使用,看了所有近乎相同的axios文档都没有提到这一点 建议方式 在main.js中如下声明使用 import axios from 'axios'; ...

  10. Vue Cli 中使用 Karma / Chrome 执行样式相关单元测试

    在 GearCase 开源项目 中,我使用了 Vue Cli 的默认测试框架.因此和样式相关的东西,都无法进行测试.因为它并不类似于无头浏览器,而是存在于虚拟内存之中. 现状 在如下 button.s ...

随机推荐

  1. MySQL NoInstall 配置

    1.下载 mysql-mysql-5.1.55-win32.zip 2. 解压缩到任何一个目录,最好目录名称不要有空格: 例如:C:\mysql 3. 删除Embedded,include,lib,m ...

  2. C++开始前篇,深入编译链接(3)

    一,COMMON块 什么是COMMON块,这是一种机制,早期的Fortran没有动态分配空间的机制,程序员必须事先声明它所需要的临时使用空间的大小.Fortran把这种空间叫做COMMON块,当不同的 ...

  3. SVN需要忽略的文件类型

    自己在用的,有问题的话欢迎指正,直接复制粘贴即可.(一般人我都不告诉他) *.lo,*.la,*.al,*.so,*.so.[0-9]*,*.pyc,*.pyo,*.rej,.*.swp,.DS_St ...

  4. HTML入门教程 这里可以免费学习啦

    本文目标 30分钟内让你明白HTML是什么,并对它有一些基本的了解.一旦入门后,你可以从网上找到更多更详细的资料来继续学习. 什么是HTML HTML是英文Hyper Text Mark-up Lan ...

  5. 移动端js知识总结

    1.如果使用jquery绑定touch事件的话,获取touchstart,touchmove的触点坐标用 e.originalEvent.targetTouches[0].pageX, 获取touch ...

  6. JAVA 引入 junit工具框架

    我遇到的麻烦 : 开始直接按照视频上的来做,直接也是引入的他上面的jar ,但是我只引入了一个,就是上面的junit-4.4.jar,然后就会报错,会出现,空指针的错误, 后面我又按照网上的教程 这里 ...

  7. 揭开Java IO流中的flush()的神秘面纱

    大家在使用Java IO流中OutputStream.PrintWriter --时,会经常用到它的flush()方法. 与在网络硬件中缓存一样,流还可以在软件中得到缓存,即直接在Java代码中缓存. ...

  8. LeetCode 1. Two Sum

    Problem: Given an array of integers, return indices of the two numbers such that they add up to a sp ...

  9. 分享一个discuz touch端的jQuery下拉刷新组件

    在线Demo 最近装了个discuz论坛, 趣股VIP吧,发现里面内置的jQuery上拉刷新组件写得还行,STATICURL可以用'http://o9gzet7tk.bkt.clouddn.com/i ...

  10. DB Scan算法的分析与实现

    摘自:http://www.cnblogs.com/weixliu/archive/2012/12/08/2808815.html 根据上面第二个数据集的簇的形状比较怪异,分簇结果应该是连起来的属于一 ...