티스토리 뷰
# SCSS 폴더 구조
@/assets/scss
ㄴabstracts
ㄴ_mixins.scss
ㄴ_variables.scss
ㄴbase
ㄴ_reset.scss
ㄴ_typography.scss
ㄴcomponents
ㄴ_buttons.scss
ㄴ_dropdown.scss
ㄴlayout
ㄴ_footer.scss
ㄴ_forms.scss
ㄴ_header.scss
ㄴ_navigation.scss
ㄴpages
ㄴ_contact.scss
ㄴ_home.scss
ㄴ_index.scss
// _index.scss
// 위에 모든 SCSS를 한 곳으로 모으는 css
@import "abstracts/mixins";
@import "abstracts/variables";
@import "base/reset";
@import "base/typography";
@import "components/buttons";
@import "components/dropdown";
@import "layout/footer";
@import "layout/forms";
@import "layout/navigation";
@import "layout/header";
@import "pages/contact";
@import "pages/home";
// vue 3 기준
// vue.config.js
const { defineConfig } = require("@vue/cli-service")
module.exports = defineConfig({
...
css: {
loaderOptions: {
sass: {
additionalData: `
@import "@/assets/scss/_index.scss"
`
}
}
}
})
'Vue.js' 카테고리의 다른 글
[Vue.js] img 태그에 src 속성 사용 시 이미지가 나타나지 않을 경우 해결방법 (0) | 2024.01.07 |
---|---|
[기초개념] emit 이해하기 (0) | 2021.10.17 |
[Vue.js] v-if / v-show의 차이점 (0) | 2021.10.12 |
[Vue.js] watch (0) | 2021.10.12 |
[Vue.js] computed : Getter / Setter (0) | 2021.10.12 |
댓글
공지사항
최근에 올라온 글