解讀vue生成的文件目錄結(jié)構(gòu)及說明
利用node和npm環(huán)境我們可以很快的搭建一個vue環(huán)境。具體步驟，請看上一篇博客。搭建完成后，我們可以看到生成的文件夾中包括如下文件：
1、build文件夾是保存一些webpack的初始化配置。config文件夾保存一些項目初始化的配置。
2、node_modules是npm加載的項目依賴的模塊。
3、src目錄是我們要開發(fā)的目錄，打開是這樣的：
其中assets：用來放置圖片
components:用來放組件文件
app.vue:是項目入口文件，代碼如下：
App.vue相當(dāng)于一個組件
main.js是項目的核心文件。代碼如下：
import Vue from ‘vue' import App from ‘./App' import router from ‘./router'
這三句的意思是首先引入vue,然后引入了./App即App.vue文件。最后一句是引入一段路由配置。
然后是實例化new Vue .el:'#app'意思誰將所有的組件都放在id為app的元素中。components表明引入的文件，此處就是app.vue這個文件,這個文件的內(nèi)容將以這樣的標(biāo)簽寫進(jìn)#app中。
觀察App.vue文件我們看可以看到一共有三個部分，分別是。
webpack在編譯時可以將.vue文件中的這三部分抽出來合成cinderella單獨的文件。
4、static文件夾用來放置靜態(tài)資源目錄
5、index.html是首頁入口文件
6、package.json是項目配置文件
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
vue實現(xiàn)在一個方法執(zhí)行完后執(zhí)行另一個方法的示例
今天小編就為大家分享一篇vue實現(xiàn)在一個方法執(zhí)行完后執(zhí)行另一個方法的示例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
這篇文章主要介紹了vue.js移動端app實戰(zhàn)1：初始配置詳解,具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-07-07
Vue Router之router.push和router.resolve頁面跳轉(zhuǎn)方式
這篇文章主要介紹了Vue Router之router.push和router.resolve頁面跳轉(zhuǎn)方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2025-04-04
基于vue cli 通過命令行傳參實現(xiàn)多環(huán)境配置
這篇文章主要介紹了vue項目通過命令行傳參實現(xiàn)多環(huán)境配置(基于@vue/cli)的相關(guān)資料,需要的朋友可以參考下2018-07-07
這篇文章主要介紹了vue類名如何獲取動態(tài)生成的元素，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
在Vue3中,我們經(jīng)常會遇到需要處理列表渲染的情況,Vue3引入了一種新的語法,即#default=“scope”,本文就來介紹一下Vue3中#default=“scope”的使用,感興趣的可以了解一下2023-10-10
vue 路由懶加載中給 Webpack Chunks 命名的方法
這篇文章主要介紹了在 vue 路由懶加載中給 Webpack Chunks 命名的方法，本文給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-04-04
解決vue項目中type=”file“ change事件只執(zhí)行一次的問題
這篇文章主要介紹了vue項目中解決type=”file“ change事件只執(zhí)行一次的問題,本文給大家介紹的非常詳細(xì)，需要的朋友可以參考下2018-05-05
v-cloak原理是先通過樣式隱藏內(nèi)容,然后在內(nèi)存中進(jìn)行值的替換,將替換的內(nèi)容再反饋給界面,數(shù)據(jù)渲染完場之后,v-cloak 屬性會被自動去除,本文詳細(xì)介紹vue中v-cloak的作用和原理解析,感興趣的朋友一起看看吧2023-09-09
這篇文章主要介紹了vue中字符串如何拼接路由path路徑方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-12-12