Vue+NodeJS+ElementUI 的簡單示例


1、演示所使用到的工具:谷歌瀏覽器、HBuilder、cmd命令窗口、nodejs(自帶npm)

2、切換到項目中

3、使用 vue 命令添加 elementUI的插件(element)

 

 4、選擇Fully import(全部導入), 也可以選擇 import on demand(按需導入) 回車鍵確認。

5、do you wish to overwrite element's SCSS variable (是否希望改寫元素的SCSS變量)

 6、choose the locale you want to load( 選擇要加載的區域) 選擇zh-CN回車。

7、element插件下載完成。

8、現在我們在項目中的src文件夾中有一個plugins文件,它里面有一個element.js腳本。

9、現在讓我們啟動項目服務器。

11、接下來使用HBuilder 打開 此 項目。

12、開始編寫代碼。

  12.1、編輯我們的第一個Vue組件。(點擊HelloWorld.vue)

12.2、將里面默認的東西,通通干掉。

12.3、去到Element UI 直接拿它做好的組件。

12.5、然后回到瀏覽器就會發現(它會自動刷新)之前的界面已經變成了,我們去Element UI官網 復制下來的實力組件。

 注:這個界面不能關掉。不然瀏覽不了網址的(本地服務器),當想停止使用時按 Ctrl+C 就可以停止使用。

 下載地址:https://github.com/nongzihong/vue_nodejs_element.git


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM