Как подключить scss в vue.config.js?

Question

[Александр Иванов]

const path = require('path')

function resolve (dir) {
    return path.join(__dirname, dir)
}

module.exports = {
    chainWebpack: config => {
        config.resolve.alias
            .set('@', resolve('src'))
    }, 
    css: {
        loaderOptions: {
            sass: {
                data: `@import "@/scss/settings.scss";`
                //data: `@import "/src/scss/settings.scss";`
                //data: `@import "./src/scss/settings.scss";`
            }
        }
    }
}

Файл настройки vue.config.js отличается от стандартного webpack вроде по примеру как внизу сделал
https://cli.vuejs.org/guide/css.html#passing-optio...

Answer 1

[Александр Иванов]

Пока добавил в app.vue

<style lang="scss">
   @import '@/scss/settings.scss';
</style>

Но что-то мне кажется что должно это подключать через вебпак

Comments

[Руслан Махин]

Если Вы создавали Vue приложение через vue create (или как-то немного иначе)
То Вам достаточно лишь установить scss пакет через yarn|npm
И этого будет достаточно, чтобы написать <style lang="scss">

ПыСы в крайнем случае сборщик скажет, чего не хватает)
а так во Vue встроен отличный модуль, который сам все понимает и подключает

[Александр Иванов]

Руслан Махин, ок

Answer 2

[wergbitsky]

https://cli.vuejs.org/ru/guide/css.html#css-%D0%BC...
тут много по твоему вопросу