html項目引入element-ui

時間 2020-09-14

標籤 html 項目引入 element 欄目 HTML 简体版

原文原文鏈接

1.html 頁面外部的 element-uicss

<!--引入 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的圖標等，美滋滋，html

2.第一種方式是有網的狀況下，可是若是在內網，沒有互聯網怎麼辦？vue

這就須要咱們把vue和element-ui下載到本地了。npm

下載地址 vue.js： https://cdn.jsdelivr.net/npm/vue/dist/vue.jselement-ui

　　　　element.js: https://unpkg.com/element-ui@2.4.11/lib/index.jsui

　　　　element.css: https://unpkg.com/element-ui@2.4.11 /lib/theme-chalk/index.cssspa

　　我是粘貼複製到本地的，注意element-ui使用的是2.4.11版本的。.net

html中引用scala

<html lang="zh-cn">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
        <link rel="stylesheet" type="text/css" href="../css/base.css" />
        <!--引入 element-ui 的樣式-->
        <link rel="stylesheet" type="text/css" href="../css/element.css">
        <!-- 必須先引入vue  後使用element-ui -->
        <script src="../js/build/vue/vue.js"></script>
        <!-- 引入element 的組件庫-->
        <script src="../js/build/vue/element.js"></script>
    </head>