Move config folder. add __APP_ENV__ global var

.eslintrc.js

@@ -8,7 +8,8 @@ module.exports = {
   ],
   globals: {
     defineEmits: true,
-    defineProps: true
+    defineProps: true,
+    __APP_ENV__: true
   },
   rules: {
     'vue/no-v-html': 'off'

config/vendor/tailwind.config.js

@@ -0,0 +1,5 @@
+module.exports = {
+  presets: [
+    require('../../tailwind.config.js')
+  ]
+}

package.json

@@ -9,6 +9,7 @@
   },
   "dependencies": {
     "axios": "^0.27.2",
+    "js-yaml": "^4.1.0",
     "leaflet": "^1.8.0",
     "vue": "^3.2.37",
     "vue-router": "^4.1.2"

src/components/Layout/LayoutFooter.vue

@@ -74,19 +74,13 @@
 </template>
 <script setup>
 
-import projectConfiguration from '@/config/project.yml'
-import copyrightConfiguration from '@/config/copyright.yml'
-
 const {
   project_authors,
   project_citation,
-  project_url
-} = projectConfiguration
-
-const {
+  project_url,
   copyright_text,
   copyright_image,
   copyright_image_link
-} = copyrightConfiguration
+} = __APP_ENV__
 
 </script>

src/components/Layout/LayoutHeader.vue

@@ -90,18 +90,12 @@
 </template>
 
 <script setup>
-
-import headerConfiguration from '@/config/header.yml'
-import projectConfiguration from '@/config/project.yml'
-import SwitchTheme from '../SwitchTheme.vue';
+import SwitchTheme from '../SwitchTheme.vue'
 
 const {
   logo,
-  links
-} = headerConfiguration
-
-const {
+  links,
   project_name
-} = projectConfiguration
+} = __APP_ENV__
 
 </script>

src/components/Map/VMap.vue

@@ -21,7 +21,6 @@ import iconRetina from 'leaflet/dist/images/marker-icon-2x.png'
 import iconUrl from 'leaflet/dist/images/marker-icon.png'
 import shadowUrl from 'leaflet/dist/images/marker-shadow.png'
 import geojsonDefaultOptions from './utils/geojsonOptions'
-import mappingConfiguration from '@/config/mapping.yml'
 
 delete L.Icon.Default.prototype._getIconUrl
 
@@ -31,7 +30,7 @@ L.Icon.Default.mergeOptions({
   shadowUrl: shadowUrl
 })
 
-const { map_server_tils } = mappingConfiguration
+const { map_server_tils } = __APP_ENV__
 
 const props = defineProps({
   zoomAnimate: {

src/constants/configPaths.js

@@ -1,4 +1,4 @@
 module.exports = { 
-  userTailwindConfigPath: './src/config/vendor/tailwind.config.js',
+  userTailwindConfigPath: './config/vendor/tailwind.config.js',
   defaultTailwindConfigPath: './tailwind.config.js'
 }

src/router/index.js

@@ -6,7 +6,7 @@ import {
 
 import otusRoutes from '@/modules/otus/router'
 import dynamicRoutes from '~pages'
-import routerConfiguration from '@/config/router.yml'
+import routerConfiguration from '../../config/router.yml'
 
 const { base_url, hash_mode } = routerConfiguration
 

src/utils/loadConfiguration.js

@@ -0,0 +1,10 @@
+import fs from 'fs'
+import yaml from 'js-yaml'
+import glob from 'glob'
+
+export const loadConfiguration = appPath => {
+  const filePaths = glob.sync(appPath + '/config/*.yml', {})
+  const jsonConfig = filePaths.map(filepath => yaml.load(fs.readFileSync(filepath, 'utf8')))
+
+  return Object.assign({}, ...jsonConfig)
+}

src/utils/request.js

@@ -1,10 +1,9 @@
 import axios from 'axios'
-import requiredConfiguration from '@/config/api.yml'
 
 const {
   url,
   project_token
-} = requiredConfiguration
+} = __APP_ENV__
 
 const makeAPIRequest = axios.create({
   baseURL: url,

vite.config.js

@@ -1,16 +1,20 @@
 import { defineConfig, loadEnv } from 'vite'
+import { loadConfiguration } from './src/utils/loadConfiguration.js'
 import Vue from '@vitejs/plugin-vue'
 import Markdown from 'vite-plugin-md'
 import path from 'path'
 import Pages from 'vite-plugin-pages'
 import Content from '@originjs/vite-plugin-content'
 
-// https://vitejs.dev/config/
 export default ({ mode }) => {
   const { VITE_BASE_URL } = loadEnv(mode, process.cwd())
 
   return defineConfig({
     base: VITE_BASE_URL,
+    define: {
+     __APP_ENV__: loadConfiguration(__dirname),
+     __APP_PATH__: () => __dirname
+    },
     resolve: {
       alias: {
         '@': path.resolve(__dirname, './src')