vue+ element 搭建

//? 安裝谷歌vue開發(fā)者工具插件

http://www.jb51.net/article/118557.htm

//? 使用命令行

http://blog.csdn.net/sangjinchao/article/details/58064767

# 全局安裝 vue-cli

$ npm install --global vue-cli

# 創(chuàng)建一個基于 webpack 模板的新項目

$ vue init webpack my-project

# 安裝依賴,走你

$cdmy-project

$ npm install

$ npm run dev


如果瀏覽器打開之后,沒有加載出頁面,說明本地的8080 端口被占用,需要修改一下配置文件config/index.js


端口更改

解釋:1.將 build 的路徑前綴修改為 ' ./ '(原本為 ' / '),是因為打包之后,外部引入 js 和 css 文件時,如果路

徑以 ' / ' 開頭,那么在本地是無法找到對應(yīng)文件。所以如果需要在本地打開打包后的文件,

就得修改文件路徑。

2.將端口號改為不常用的端口。


項目搭建完成

2.引入elementUI.js

1.打開cmd,在當(dāng)前目錄中運行:npm i element-ui -S

2.src/main.js(紅色的)

// The Vue build version to load with the `import` command

// (runtime-only or standalone) has been set in webpack.base.conf with an alias.

import Vue from 'vue'

import App from './App'

import router from './router'

import ElementUI from 'element-ui'

import 'element-ui/lib/theme-default/index.css'

Vue.config.productionTip = false

/* eslint-disable no-new */

Vue.use(ElementUI)

new Vue({

el: '#app',

router,

template: '',

components: { App }

})

3.然后在.vue文件里就直接可以用了

例如:在src/components/Hello.vue做一下修改


修改vue組件


最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容