1. 程式人生 > >vue-cli 3.0腳手架配置及擴充套件 (三):config.app.js應用目錄配置

vue-cli 3.0腳手架配置及擴充套件 (三):config.app.js應用目錄配置

工程目錄如圖,config.app.js檔案在src原始碼目錄下


config.app.js檔案是我為了方便測試模擬的專案結構,程式碼如下:

/**
 * @fileOverview app配置
 * @author Franks.T.D
 * @date 2018/06/17
 */

module.exports = {
  APP_NAME: ['www', 'memberCenter'], // 應用名,按順序對應APP_LIST元素位
  APP_LIST: [
    {
      BASE_URL: '', // 二級目錄
      INDEX_HTML: 'mod1', // 預設頁(自動改名為index.html)
      CONTEXT_DIRECTORY: [ // 目錄樹結構(上接BASE_URL或DOMAIN)
        'mod2',
        {
          'goods': [
            'mod4',
            'mod5'
          ],
          'coupons': [
            'mod6',
            {
              'points_coupons': [
                'mod7',
                'mod8',
                'mod3'
              ]
            }
          ]
        }
      ]
    },
    {
      BASE_URL: 'v3.0', // 二級目錄
      INDEX_HTML: 'mod9', // 預設頁(自動改名為index.html)
      CONTEXT_DIRECTORY: [ // 目錄樹結構(上接BASE_URL或DOMAIN)
        'mod10',
        'mod11',
        {
          'user': [
            'mod12',
            'mod13'
          ],
          'order': [
            'mod14',
            {
              'comment': [
                'mod15',
                'mod16'
              ]
            }
          ]
        }
      ]
    }
  ]
}
APP_NAME的app對應相同位置的APP_LIST的配置,這裡APP_LIST對應了www和memberCenter兩個應用的配置,BASE_URL為二級目錄,也為根域上下文目錄;INDEX_HTML代表了該應用的預設起始頁,值為src/modules/下的模組目錄名;CONTEXT_DIRECTORY為正常目錄結構,型別為陣列,陣列元素為string時,對應該級下存在對應的以模組目錄為名稱的html檔案,陣列元素為Object時,代表存在下級。

相關推薦

vue-cli 3.0腳手架配置擴充套件 config.app.js應用目錄配置

工程目錄如圖,config.app.js檔案在src原始碼目錄下config.app.js檔案是我為了方便測試模擬的專案結構,程式碼如下:/** * @fileOverview app配置 * @author Franks.T.D * @date 2018/06/17

vue-cli 3.0腳手架配置擴充套件 AppConf類

本類為config.app.js提供基礎服務,主要業務為對外應用資訊、頁面資訊、頁面URL資訊、baseUrl資訊以及應用和頁面是否存在校驗服務程式碼如下,不懂可留言討論:/** * @fileOverview app配置資料處理類 * @author Franks.T.

vue-cli 3.0腳手架配置擴充套件 VueConf類

本類為vue.config.js提供基礎服務,主要業務為根據當前命令獲得有效的頁面資訊,將頁面資訊整合為多頁資料結構,供vue.config.js檔案使用;也同時提供baseUrl屬性,因涉及到多應用會有多個baseURL,baseUrl屬性在npm run serve時恆為

Vue CLI 3.0腳手架如何在本地配置mock資料

前後端分離的開發模式已經是目前前端的主流模式,至於為什麼會前後端分離的開發我們就不做過多的闡述,既然是前後端分離的模式開發肯定是離不開前端的資料模擬階段。 我們在開發的過程中,由於後臺介面的沒有完成或者沒有穩定之前我們都是採用模擬資料的方式去進行開發專案,這樣會使我們的前後端會同時的進行,提高我們的開發效率

vue-cli 3.0 腳手架使用記錄

一/ 在2.X中靜態資原始檔放在static資料夾中,此資料夾裡的東西不會被webpack打包,而在3.X中沒有該檔案,於是我在根目錄新建了一個static資料夾存放reset.css檔案,出現了在index.html引入reset無效的問題,經過查資料發現3.X中的public資料夾類似於

vue/cli 3.0腳手架搭建

在vue 2.9.6中,搭建vue-cli腳手架的流程是這樣的:  首先 全域性安裝vue-cli,在cmd中輸入命令: npm install --global vue-cli  安裝成功:  安裝完成之後輸入 vue -V(注意這裡是大寫的“V”),如下圖,如果出現

真小白體驗 vue-cli 3.0 腳手架搭建~

真小白體驗 vue-cli 3.0 專案搭建~ Vue.js(讀音 /vjuː/, 類似於 view)是一個構建資料驅動的 web 介面的漸進式框架。Vue.js 的目標是通過儘可能簡單的 API 實現響應的資料繫結和組合的檢視元件。它不僅易於上手,還便於與第三

深入解析Vue CLI 3.0腳手架如何mock資料

前後端分離的開發模式已經是目前前端的主流模式,至於為什麼會前後端分離的開發我們就不做過多的闡述,既然是前後端分離的模式開發肯定是離不開前端的資料模擬階段。 我們在開發的過程中,由於後臺介面的沒有完成或者沒有穩定之前我們都是採用模擬資料的方式去進行開發專案,這樣會使我們的前後端會同時的進行

[Vue 牛刀小試]第十七章 - 優化 Vue CLI 3 構建的前端專案模板1- 基礎專案模板介紹

 一、前言   在上一章中,我們開始通過 Vue CLI 去搭建屬於自己的前端 Vue 專案模板,就像我們 .NET 程式設計師在使用 asp.net core 時一樣,我們更多的會在框架基礎上按照自己的開發習慣進行調整。因此在後面幾章的學習中,我將會在整個專案基礎上,按照自己的需求進行修改設定。

Java中String、StringBuilder、StringBuffer常用源碼分析比較String、StringBuilder、StringBuffer比較

val str 成員變量 相同 += let .get end art 看這篇隨筆之前請務必先看前面兩章: Java中String、StringBuilder、StringBuffer常用源碼分析及比較(一):String源碼分析 Java中String、StringBui

SmartGit 安裝使用合併、撤銷提交,以及分支操作等

一、合併多次提交 選擇需要合併的commit,右鍵,選擇Squash commit,寫好提交說明。 二、恢復本地提交 在分支上右鍵,選擇Reset。 三、撤銷遠端提交 1、選擇某一次提交,右鍵,選擇reset,成功之後,在該次提交時間之後的本地提交就都會刪除。

BitShares2.0 —— 第一章 創世篇創世紀 執行見證節

NODE (節點) 節點種類 英文抄自官方文件 Full node 全節點 (non-block producing witness nodes 不產塊的見證人節點) block producing

MyBatis學習筆記mybatis-config.xml都有哪些配置之typeAliases與plugins

類型別名(typeAlicases) 在mybatis-config.xml配置檔案中加入類描述 <typeAliases> <typeAlias type="org.mybatis.example.User" alias="User" />

vue-cli 3.0.3配置基本環境打包

-c 新建 例如 pro devel ase 語句 項目 git 從新建項目到設置打包環境 1.vue create vue-cli-env 2.新建 vue.config.js 文件,設置baseUrl: ‘./‘ 3.新建各個環境的文件,例如:.env.developm

Vue-cli 3.0 打包配置

關於Vue-cli3.0打包官網上也沒有給出什麼具體的例子,下面是個人根據專案打包執行成功之後的一些記錄: vue-cli 3.0創立的專案所有的配置都在vue-config.js中完成,下面是我自己的配置: const path = require('path') const

git bash here 的 ~/.bashrc 配置檔案。和 vue/cli 3. 0 的 .vuerc檔案preset

  今天就來講一下git有關的小技巧,.bashrc檔案是使用者配置文環境變數的檔案,每次git bash會首先執行裡面的內容 1.自動執行      每次進入git bash都會先讀取.bashrc

vue-cli 3.0 實用配置

進行 ngs .com .config 移除 目的 local github 開始 文件壓縮如何去掉console 在使用vue開發項目的過程中,免不了在調試的時候會寫許多console,在控制臺進行調試;在開發的時候這種輸出是必須的,但是build後線上運行時這個東西是不

vue-cli 3.0 使用axios配置跨域訪問豆瓣接口

mbo 環境 因此 代碼 compile onf demo sub style vue-cli 3.0 配置axios跨域訪問豆瓣接口 自己做的小demo 由於豆瓣api跨域問題,因此不能直接通過ajax請求訪問,我們通過vue-cli提供給我們的代理 進行配置即可,

【bug】vue-cli 3.0報錯的解決辦法

文件中 分享圖片 not main res idt 說明 exports 修改 先上bug圖片 bug說明:初裝vue_cli3.0寫了個組件,運行錯誤,顯示如圖, 代碼提示:[Vue warn]: You are using the runtime-only bu

vue-cli 3.0 初體驗

img 項目 alt 3.x ini cti eight for clean 一. 準備   1.卸載vue-cli 1.x 或2.x版本,npm uninstall -g vue-cli   2.node版本需 8.9 及以上 二. 安裝   1. 安裝3.x版本 npm