I'm currently in the process of setting up a new vuejs project from scratch, but I've encountered an error when trying to import "style.scss" into my component. Specifically, the issue arises in the Login.vue file where I include the style.scss.
<template>
<div class="container">
<div class="card">
<h1>This is the login page</h1>
</div>
</div>
</template>
<script>
export default {
name: "Login"
};
</script>
<style lang="scss">
@import 'style.scss';
</style>
In terms of file structure, style.scss can be found under /src, while the Login.vue component is located within /src/views:
https://i.sstatic.net/elXil.png
Despite multiple attempts, including changing the import statement to:
@import '/style.scss'; //and
@import '../style.scss';
Unfortunately, the problem persists. Here's a glimpse at my webpack configuration for sass-loader:
{
test: /\.scss$/,
use: [
'vue-style-loader',
'css-loader',
'sass-loader'
]
}