VUE(6)--引入elementUI到项目中

1. npm下载方式引入

下载命令：npm install element-ui --save

main.js中引入：

import ElementUI from 'element-ui' //引入脚本文件
import 'element-ui/lib/theme-chalk/index.css' //引入样式
Vue.use(ElementUI); //使用组件

2. cdn形式引入（脚手架搭建项目）

index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>vue-cdn</title>
	  <link rel="stylesheet" href="static/elementUI/elementUI.css">    
  </head>
  <body>
   <script src="static/vue/vue.js"></script>
    <script src="static/elementUI/elementUI.js"></script>
    <div id="app"></div>
    <!-- 这里一定要引入vue.js否则会报错，记住本地静态资源要放于static文件夹下 -->
  </body>
</html>

webpack.base.conf.js

 externals: { 
    'vue': 'Vue', //外部引入的资源在这里要定义
    'element-ui': 'element-ui',
  }

main.js

要有 import Vue from 'vue' 不用再引入elementUI

来源：CSDN

作者：Tansy_big_rabbit

链接：https://blog.csdn.net/tansy_big_rabbit/article/details/104397475

标签

vue

易学教程内所有资源均来自网络或用户发布的内容，如有违反法律规定的内容欢迎反馈！
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!