VUE專案目錄結構
如上圖所示，我們的目錄結構就是這樣的了。
| 目錄/檔案 | 說明 |
|---|---|
| build | 這個是我們最終釋出的時候會把程式碼釋出在這裡，在開發階段，我們基本不用管。 |
| config | 配置目錄，預設配置沒有問題，所以我們也不用管 |
| node_modules | 這個目錄是存放我們專案開發依賴的一些模組，這裡面有很多很多內容，不過高興的是，我們也不用管 |
| src | 我們的開發目錄，基本上絕大多數工作都是在這裡開展的 |
| static | 資源目錄，我們可以把一些圖片啊，字型啊，放在這裡。 |
| test | 初始測試目錄，沒用，刪除即可 |
| .xxxx檔案 | 這些是一些配置檔案，包括語法配置，git配置等。基本不用管，放著就是了 |
| index.html | 首頁入口檔案，基本不用管，如果是開發移動端專案，可以在head區域加上你合適的meta頭 |
| package.json | 專案配置檔案。前期基本不用管，但是你可以找一下相關的資料，學習一下里面的各項配置。至少，要知道分別是幹嘛的。初期就不管了。 |
| README.md | 不用管 |
如上，基本上就是這麼個情況。重要的，還是src資料夾。
SRC資料夾的情況
如上圖所示，這是src資料夾下面的初始情況，裡面有一些示例程式碼之類的。比如，它吧logo放在assets資料夾裡面。我個人很不喜歡這麼做，因為程式碼是程式碼，資源是資源，各歸其位比較好。
commponents目錄裡面放了一個演示的元件檔案，你可以開啟看下。當然，也可以直接刪除，然後根據我的博文往下走。
App.vue是專案入口檔案。當然，我們需要改造，改造成我們可以使用的樣子的。後面的博文會說。
main.js這是專案的核心檔案。全域性的配置都在這個檔案裡面配置，我後面會詳細的講這裡怎麼搞。
整理目錄
上面只是讓大家瞭解一下具體是什麼情況，下面，我們開始動手，把不想管的幹掉，然後把src變成這個樣子:
如上圖所示，把資料夾和檔案都新建好，後面的博文我會詳細給出每個檔案的程式碼的。這裡，都新建空檔案即可。注意，我是用scss來寫css檔案的。所以看官你最好也學習一下scss的相關內容，我的部落格裡面有，搜尋也是一大把。
| 檔案\目錄 | 說明 |
|---|---|
| component | 元件資料夾我們寫的一些公用的內容可以放在這裡的。 |
| config | 核心配置資料夾 |
| frame | 存放自路由的資料夾 |
| page | 專案模板資料夾,所有的頁面檔案全部存放與此，後面會根據需要來建立各種子目錄 |
| style | 樣式存放目錄 |
vue支援每一個模板裡面寫css，這樣可以做到隨用隨取。但是，我個人不太喜歡這樣，我還是喜歡吧css給單獨放出來，因為這樣便於整理，另外，使用scss的朋友都知道，我們會預設大量的變數，程式碼片供我們在寫css的時候使用，如果每個模板檔案裡面都需要引用一次那是及其操蛋的。
你可以先根據我這一套來。然後等你全部融會貫通了之後，你可以想怎麼玩兒怎麼玩兒。隨便。
這篇博文先到這裡，後面我們繼續講。
首發地址：blog.csdn.net/fungleo/art…