資訊專欄INFORMATION COLUMN
摘要：前端開發(fā)規(guī)范之項目目錄架構(gòu)概述項目開發(fā)的目錄結(jié)構(gòu)保持一致，容易理解并方便構(gòu)建與管理，方便日后的維護和其他同事的閱讀。
前端開發(fā)規(guī)范之Vue項目目錄架構(gòu)
概述
Vue項目開發(fā)的目錄結(jié)構(gòu)保持一致，容易理解并方便構(gòu)建與管理，方便日后的維護和其他同事的閱讀。
一、Vue目錄結(jié)構(gòu)
二、主要項目目錄介紹
1.build目錄是webpack主要的配置目錄
其中比較重要是 webpack.base.conf.js
兼容ES6配置
配置地址常量
配置自定義loader
2.config目錄是對webpack和node最基礎(chǔ)的配置，定義了當前所屬環(huán)境，監(jiān)聽的端口號，生成靜態(tài)文件目錄位置等
其中比較重要是 index.js
配置node監(jiān)聽端口、靜態(tài)文件位置，靜態(tài)文件引用前綴、node代理等
3.js目錄是項目開發(fā)過程中的自行開發(fā)或引用的小型js庫
其中比較重要的是 http.js，封裝了axios庫的常見用法，可以配置統(tǒng)一的request攔截器和response攔截器，其他的有類似日期類庫，echarts封裝類，vue的mixin庫等
4.stylus目錄是css預處理語言目錄
主要的樣式文件
base --- 基礎(chǔ)組件樣式
mixin --- 混合函數(shù)庫
reset --- 重置樣式庫
variable --- 全局變量聲明
5.其他components、router、store目錄
這三個目錄結(jié)構(gòu)是vue項目開發(fā)過程中獨有的，分別代表vue組件目錄，vue-router配置目錄、以及vuex配置目錄。
具體規(guī)范見
vue組件開發(fā)規(guī)范
vue-router配置規(guī)范
vuex配置規(guī)范
三、結(jié)語
目前開發(fā)vue項目的前端目錄結(jié)構(gòu)大致與此文大檔介紹的架構(gòu)一致，可能由于不同項目有具體需求會進行微量修改，但大體目錄骨架與此一致，若后續(xù)進行vue項目開發(fā)，需遵循此目錄架構(gòu)，以方便各位同事快速在不同項目間開展工作。
后續(xù)若由于技術(shù)棧更新會適當調(diào)整此文檔
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/96054.html
摘要：好的項目代碼結(jié)構(gòu)會大大提升項目的維護性和可擴展性。多說無益，我這里直接給大家一個示意圖，大家可以按照我給的這個項目結(jié)構(gòu)組織項目。你連文件目錄都設(shè)計不好，我拿什么相信你能設(shè)計出來可擴展的程序 很多人都會用項目腳手架，也會跑hello world，然后再寫寫簡單的todolist。但是再往下深入就難了。比如很多教程和老師都會說，大家要多問一個為什么。其實我想說多問你妹啊。我都不知道問為什么...
摘要：前言想想也已經(jīng)做過不少架構(gòu)的項目了，有基于，基于，基于，基于的。好了，介紹完畢，接下來，我就從零開始，一步一步建起前后端完全分離的前端架構(gòu)了。 前言 想想也已經(jīng)做過不少架構(gòu)的項目了，有基于vue，基于react，基于thinkPHP，基于laravel的。 做多了，也就對現(xiàn)有的架構(gòu)有各種想法，有好的，有壞的，總之，用起來還是不爽。vue-cli雖然可以很快地構(gòu)建并使用，尤其是vue-c...
摘要：前言這一篇，我們將接著上篇來完成創(chuàng)建項目文件目錄架構(gòu)。總結(jié)這篇主要是文件和目錄架構(gòu)的東西，讀者務(wù)必運行一下完整的項目。因此，下一篇，我們將通過實現(xiàn)本地數(shù)據(jù)接口模擬從零開始做前端架構(gòu)項目完整代碼前端架構(gòu)子咻 前言 這一篇，我們將接著上篇來完成創(chuàng)建項目文件、目錄架構(gòu)。 回顧 先回顧一下現(xiàn)在項目有哪些東西了： . ├── app │?? ├── app.vue │?? ├── common ...
摘要：連接數(shù)據(jù)庫如果不自己創(chuàng)建默認數(shù)據(jù)庫會自動生成地址跟第一步的地址對應(yīng)?，F(xiàn)在回過頭來看里面的入口文件最后，我們在瀏覽器輸入，就會跳到。到此為止，我們就完成了整個前后端各自開發(fā)到正式部署的流程。 一個完整的網(wǎng)站服務(wù)架構(gòu)包括：1、web frame ---這里應(yīng)用express框架2、web server ---這里應(yīng)用nodejs3、Database ---這里應(yīng)用monggoDB4、...
閱讀 1175·2021-11-23 10:04
閱讀 2434·2021-11-22 15:29
閱讀 2928·2021-11-19 09:40
閱讀 756·2021-09-22 15:26
閱讀 2142·2019-08-29 16:27
閱讀 2520·2019-08-29 16:10
閱讀 1943·2019-08-29 15:43
閱讀 3303·2019-08-29 12:43
