Browse Source

add temp bootstrap-vue

axolotle 3 years ago
parent
commit
b8465290ce
7 changed files with 34 additions and 4 deletions
  1. 1 0
      package.json
  2. 2 1
      src/App.vue
  3. 0 0
      src/assets/scss/_variables.scss
  4. 23 0
      src/assets/scss/globals.scss
  5. 5 0
      src/assets/scss/main.scss
  6. 2 2
      src/main.js
  7. 1 1
      vue.config.js

+ 1 - 0
package.json

@@ -12,6 +12,7 @@
   },
   "dependencies": {
     "axios": "^0.21.1",
+    "bootstrap-vue": "^2.21.2",
     "core-js": "^3.6.5",
     "d3": "^6.5.0",
     "vue": "^2.6.11",

+ 2 - 1
src/App.vue

@@ -33,5 +33,6 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss">
+@import '@/assets/scss/main.scss';
 </style>

+ 0 - 0
src/assets/scss/variables.scss → src/assets/scss/_variables.scss


+ 23 - 0
src/assets/scss/globals.scss

@@ -0,0 +1,23 @@
+/*
+  ╭─────────────────────────────────────────────────────────────────╮
+  │                                                                 │
+  │   /!\ DO NOT IMPORT OR DEFINE ACTUAL RULES INTO THIS FILE /!\   │
+  │                                                                 │
+  │  Only things that disappear after scss compilation is allowed.  │
+  │                                                                 │
+  ╰─────────────────────────────────────────────────────────────────╯
+
+  This file is magically imported into every components so that scss variables and
+  mixins can be accessed.
+  But if some rules are defined here, they will be copied into the final build as many
+  times as there are components…
+
+*/
+
+@import 'variables';
+
+@import '~bootstrap/scss/functions';
+@import '~bootstrap/scss/variables';
+@import '~bootstrap/scss/mixins';
+
+@import '~bootstrap-vue/src/variables';

+ 5 - 0
src/assets/scss/main.scss

@@ -1,5 +1,10 @@
 @import 'variables';
 
+// Bootstrap (temp ?)
+@import '~bootstrap/scss/bootstrap.scss';
+@import '~bootstrap-vue/src/index.scss';
+
+
 html, body, #app, main {
   height: 100%;
   margin: 0;

+ 2 - 2
src/main.js

@@ -1,17 +1,17 @@
 import Vue from 'vue'
+import BootstrapVue from 'bootstrap-vue'
 import Meta from 'vue-meta'
 import Vue2TouchEvents from 'vue2-touch-events'
 import router from './router'
 import store from './store'
 
 import App from './App'
-import '@/assets/scss/main.scss'
 
 
+Vue.use(BootstrapVue)
 Vue.use(Meta)
 Vue.use(Vue2TouchEvents)
 
-
 new Vue({
   router,
   store,

+ 1 - 1
vue.config.js

@@ -11,7 +11,7 @@ module.exports = {
   css: {
     loaderOptions: {
       sass: {
-        prependData: '@import "@/assets/scss/variables.scss";'
+        prependData: '@import "@/assets/scss/_variables.scss";'
       }
     }
   },