使用手册访问：https://cloud.tencent.com/developer/doc/1270

第一步：在head添加样式

<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">

第二步：在html代码之后加
  <!-- import Vue before Element -->

  <script src="https://unpkg.com/vue/dist/vue.js"></script>

  <!-- import JavaScript -->

  <script src="https://unpkg.com/element-ui/lib/index.js"></script>

注意：使用element标签的div的id必须在new vue{}对象里：

例如：
<body>

  <div id="app">　　--element标签的div的id为#app
<el-button @click="visible = true">Button</el-button> <el-dialog :visible.sync="visible" title="Hello world"> <p>Try Element</p> </el-dialog> </div> </body>


<script>

    new Vue({

      el: '#app',　　---那么#app就必须在new Vue的el里

      data: function() {

        return { visible: false }

      }

    })

  </script>

注：不用安装什么npm i element-ui -S 之类的
 

vue的ui库使用Element UI，纯html页面，不使用webpack那玩意的更多相关文章

  1. Vue（十八）Element UI

    Elment UI 1. 简介 Element UI是饿了么团队提供的一套基于Vue2.0的组件库,可以快速搭建网站,提高开发效率 ElementUI PC端 MintUI 移动端 [官网](http ...

  2. .Net Core,VUE,VS Code,Sql Sugar,Element UI学习笔记

    1..Net Core的目的是跨平台,并主要目标是作为服务端开发使用.从3.0开始,引入了Winfrom和WPF. 2..Net Core可以引用.Net Framework生成的dll和exe,不限 ...

  3. Vue 基于node npm & vue-cli & element UI创建vue单页应用

    基于node npm & vue-cli & element UI创建vue单页应用 开发环境   Win 10   node-v10.15.3-x64.msi 下载地址: https ...

  4. vue Cli 按需引入Element UI 和全局引用Element UI

    全局引用: 一.安装 Element UI npm i element-ui -S 二.在main.js 中引入 element UI import ElementUI from 'element-u ...

  5. 移动端前端框架UI库（Frozen UI、WeUI、SUI Mobile）

    Frozen UI 自述:简单易用,轻量快捷,为移动端服务的前端框架. 主页:http://frozenui.github.io/ 开发团队:QQVIP FD Team Github:https:// ...

  6. 在vue项目中快速使用element UI

    推荐使用npm安装 1.安装:npm install element-ui -S 2.整体引入: 在你项目的main.js中写入: import ElementUI from 'element-ui' ...

  7. vue中的swiper element ui

    欢迎加入前端交流群交流知识&&获取视频资料:749539640 很多同学问,怎么把swiper引入到vue的脚手架里去,之前的一篇博客有提到怎么引入,但是后来感觉不怎么好,还是用一些v ...

  8. vue组件样式添加scoped属性之后，无法被父组件修改。或者无法在本组件修改element UI样式

    在vue开发中,需要使用scoped属性避免样式的全局干扰,但是这样在父组件中是无法被修改的,不仅如此如果项目中用了UI框架比如element Ui,这个时候在本组件也无法修改样式,因为权重问题.但是 ...

  9. vue实现多语言国际化(vue-i18n)，结合element ui、vue-router、echarts以及joint等。

    老板说我们的项目要和国际接轨,于是乎,加上了多语言(vue-i18n).项目用到的UI框架是element ui ,后续echarts.joint等全都得加上多语言. 一.言归正传,i18n在vue项 ...

随机推荐

  1. ROS C++ 规范概要

    一.动机 代码一致才能可读.联调.高效率.高复用.可移植性. 二.命名方式 CamelCased camelCased under_scored ALL_CAPITALS 2.1 Package命名方 ...

  2. printf重定向问题

    1.使用printf库函数时,要加入头文件<stdio.h> 2.另外在keil里面需要把:use MicroLIB 勾选上,不然程序没办法在线调试.编译的时候不会报错. 3.当然可以不用 ...

  3. 截屏状态监听 - iOS

    既接到电话状态监听的需求之后再次添加了截屏状态的监听,当使用 App 时若用户执行截屏操作需要对当前状态进行监听操作,下面有两种方法,其中可以替换截屏的图片内容(Plan A),也可以弹出提示框(Pl ...

  4. javacript window对象

    Window -- 代表浏览器中一个打开的窗口: 对象属性 window //窗口自身 window.self //引用本窗户window=window.self window.name //为窗口命 ...

  5. Vue中，给当前元素添加类名移除兄弟元素类名的方法

    在Vue中,给当前元素添加类名移除兄弟元素类名的方法 今天在项目中需要做一个效果,点击对应的li改变当前的color,其他的li取消颜色,在jQuery中这很容易,由于之前已经引入了jQuery,所以 ...

  6. C++构造函数及成员变量

    class MyClass { public: int m_age; float m_hight; MyClass() { } ~MyClass() { } MyClass(int age, floa ...

  7. #leetcode刷题之路24-两两交换链表中的节点

    给定一个链表,两两交换其中相邻的节点,并返回交换后的链表.你不能只是单纯的改变节点内部的值,而是需要实际的进行节点交换. 示例:给定 1->2->3->4, 你应该返回 2-> ...

  8. archLinux 学习笔记--mlocate的安装与使用

    locate - 查找文件的简单方法 locate 程序会执行一次快速的路径名数据库搜索,并且输出每个与给定子字符串相匹配的路径名. 使用时却发现archlinux出现 bash: locate:未找 ...

  9. Redis之Redis持久化

    Redis(Remote Dictionary Server)是一个可持久化的内存.Key-Value数据库. 作为内存数据库,为了防止因服务器断电或系统宕机而引起的数据丢失问题,Redis自带了持久 ...

  10. helloworld模块

    环境: HelperA64开发板 Linux3.10内核 时间:2019.01.11 目标:编译helloword模块 ​ 1.当出先下面错误时候,查找问题 ​ 问题为Make的时候默认为PC-X86 ...