html页面中如何引入element-ui
        
        
            1.html 页面外部的 element-ui
 
<!--引入 element-ui 的样式,-->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 必须先引入vue,  后使用element-ui -->
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>
<!-- 引入element 的组件库-->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
 
之后在你的html页面中可以任意的使用element-ui组件了,包括一些element-ui的图标等,美滋滋,
 
2.第一种方式是有网的情况下,但是如果在内网,没有互联网怎么办?
 
这就需要我们把vue和element-ui下载到本地了。
 
下载地址  vue.js: https://cdn.jsdelivr.net/npm/vue/dist/vue.js
 
    element.js:  https://unpkg.com/element-ui@2.4.11/lib/index.js
 
    element.css: https://unpkg.com/element-ui@2.4.11/lib/theme-chalk/index.css
 
  我是粘贴复制到本地的,注意element-ui使用的是2.4.11版本的。
 
 
  <!--引入 element-ui 的样式--> 
 
 
  <link rel="stylesheet" type="text/css" href="js/elementui/index.css"> 
 
 
  <!-- 必须先引入vue 后使用element-ui --> 
 
 
  <script src="js/elementui/vue.js"></script> 
 
 
  <!-- 引入element 的组件库--> 
 
 
  <script src="js/elementui/index.js"></script> 
 
 
  
 
 
到了这里你会发现element的基础样式可以使用,但是icon会显示不出来。那是因为你的css文件没有连接到icon的文件中,那我们还需要下载两个文件,
 
附上下载连接:两个都要下载
UNPKG - element-ui
 
放到css下的fonts目录中。
 
 
         
     
全部评论