vuejs學習——vue+vuex+vue-router項目搭建(一)

前言

　　快年末了卻有新公司邀請了我，因此打算把上家公司的學到一下技術作一些總結和分享。

　　如今vuejs都2.0了，我相信也有不少朋友和我同樣實際項目仍是選擇vue1.0的或者給新手一些參考，無論在選擇哪一個版本的時候，但願你都熟讀了vue+vuex+vue-router的官方文檔。下面咱們就開始吧。

Vue搭建

　　這裏我假設咱們的電腦都安裝了nodejs，那麼我如今開始吧。

　　咱們先新建一個文件（VueProject）,經過命令行的方式進入這個文件夾，如今假設咱們進入了VueProject文件夾，接下來進入正題吧。

　　進入安裝vue的正題時，咱們先安裝淘寶源，這樣會加快咱們下載，在命令行中輸入一下代碼。

　 $ npm install -g cnpm --registry=https://registry.npm.taobao.org

　　官網是最好的老師，給出了完整的安裝vue的步驟：

　　　　步驟1：cnpm install -g vue-cli

　　　　步驟2：vue init webpack

　　　　　　進行到這步你會發現他有這樣的提示：

　　　　　　

　　　　直接webpack下載的是最新版本 安裝1.x要在webpack後面加#1.0，咱們安裝的是1.x的項目這咱們使用 vue init webpack#1.0 go！

　　　　步驟3：cnpm install

　　　　步驟4：npm run dev

　　　　 

 　　　　命令行中看這個界面，恭喜你vue項目搭建好了，接下來咱們在瀏覽器中輸入 localhost:8080 

端口修改

　　　　localhost:8080 有可能其餘軟件佔用了，致使其餘問題的出現 咱們能夠動態修改地址

　　　　首先咱們的項目文件，在找到下圖文件夾裏的index.js
　　　　

　　　　打開index.js

　　　　

　　　　你會發如今dev中有port:8080，這就是咱們的端口，這裏隨便修改爲你想要的端口便可。

界面展現

 　　　　瀏覽器中輸入 localhost:****  回車！界面美美的。

　　　　

　　歐耶，vue搭建好了，你們趕快體驗一下vue的美麗把。下一篇文章我以如今的基礎繼續搭建vue-router，咱們下一章見。

　　新手寫博客有什麼表達不清，寫的很差的，請你們多給給意見。