• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Vue - importowanie plików SCSS

VPS Starter Arubacloud
+1 głos
187 wizyt
pytanie zadane 5 stycznia 2019 w JavaScript przez Bakr Mądrala (6,850 p.)

W jaki sposób importować wszystkie pliki SCSS do Vue?

W main.js mam import głównego pliku:

import './scss/styles.scss';

gdzie importuje wszystkie inne wydzielone pliki SCSS:

@import 'settings/*.scss';
@import 'tools/*.scss';
@import 'generic/*.scss';
@import 'vendors/**/*.scss';
@import 'ui/**/*.scss';
@import 'layout/**/*.scss';
@import 'components/**/*.scss';
@import 'sections/**/*.scss';

 

komentarz 5 stycznia 2019 przez rafal.budzis Szeryf (85,260 p.)
Za 'magie' doczytywania plikow innych niz niz js w plikach js odpowiada jakiś bundler. Podaj jakiego bundlera uzywasz prawdopodobnie bedzie to webpack. Nastepnie musisz skonfigurować odpowiednie loadery. Ale najpierw pokaż co masz w tej chwili ;-)
komentarz 5 stycznia 2019 przez Bakr Mądrala (6,850 p.)

Projekt tworzyłem przez Vue CLI.

Config w package.json:

{
  "name": "intellegi",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "vue": "^2.5.21"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^3.2.2",
    "@vue/cli-plugin-eslint": "^3.2.2",
    "@vue/cli-service": "^3.2.0",
    "@vue/eslint-config-airbnb": "^4.0.0",
    "babel-core": "^6.26.3",
    "babel-eslint": "^10.0.1",
    "babel-preset-es2015": "^6.24.1",
    "browser-sync": "^2.24.6",
    "eslint": "^5.8.0",
    "eslint-plugin-vue": "^5.0.0",
    "node-sass": "^4.11.0",
    "sass-loader": "^7.1.0",
    "vue-template-compiler": "^2.5.21"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended",
      "@vue/airbnb"
    ],
    "rules": {},
    "parserOptions": {
      "parser": "babel-eslint"
    }
  },
  "postcss": {
    "plugins": {
      "autoprefixer": {}
    }
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ]
}

 

1 odpowiedź

0 głosów
odpowiedź 5 stycznia 2019 przez Konrad Fx Mądrala (6,910 p.)
wybrane 5 stycznia 2019 przez Bakr
 
Najlepsza

Hej, 

miałem już ten problem i trzeba go rozwiązać w dość dziwny sposób, musisz zrobić specjalny plik konfiguracyjny vue, w którym wyjaśnisz jak ma się zajmować tym rozszerzeniem i gdzie je importować.

Gotowy kod jak to zrobić możesz popatrzyć na moim projekcie który to wszystko co chcesz zrobić już posiada. To jest gotowy starter z Vue właśnie z architekturą 7-1 i nie tylko! :)

Vue_Style_Starter

Kod znajduje się na githubie więc będziesz miał od razu wszystko jasne. Dodatkowo napisałem niżej dokumentacje która powinna Ci wszystko wytłumaczyć!

Powodzenia,

Trzymam kciuki!

Podobne pytania

0 głosów
1 odpowiedź 94 wizyt
pytanie zadane 1 lipca 2020 w HTML i CSS przez poldeeek Mądrala (5,980 p.)
0 głosów
2 odpowiedzi 149 wizyt
0 głosów
2 odpowiedzi 262 wizyt

92,453 zapytań

141,262 odpowiedzi

319,088 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...