npm 安裝方法:css
npm i element-ui -Shtml
CDN:vue
<!-- 引入樣式 -->node
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">python
<!-- 引入組件庫 -->ios
<script src="https://unpkg.com/element-ui/lib/index.js"></script>npm
代碼:element-ui
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <!-- import CSS --> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> </head> <body> <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> <!-- 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> <script> new Vue({ el: '#app', data: function() { return { visible: false } } }) </script>
vue中引入element
在 main.js 中寫入如下內容:
import Vue from 'vue' import ElementUI from 'element-ui' import 'element-ui/lib/theme-chalk/index.css' import App from './App.vue' Vue.use(ElementUI) new Vue({ el: '#app', render: h => h(App) })
注:import Vue from 'vue'; axios
其實最完整的寫法是import Vue from "../node_modules/vue/dist/vue.js";
app
1.import...from...的from命令後面能夠跟不少路徑格式,若只給出vue,axios這樣的包名,則會自動到node_modules中加載;若給出相對路徑及文件前綴,則到指定位置尋找。2.能夠加載各類各樣的文件:.js、.vue、.less等等。3.能夠省略掉from直接引入。