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 --><!-- 引入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版本的。

html中引用

<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>

到了这里你会发现element的基础样式可以使用,但是icon会显示不出来。那是因为你的css文件没有连接到icon的文件中,那我们还需要下载两个文件,

附上下载连接:两个都要下载

https://unpkg.com/browse/element-ui@2.10.1/lib/theme-chalk/fonts/

放到css下的fonts目录中。

我的项目目录

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容