aspnetcore-vue-typescript-template
aspnetcore-vue-typescript-template copied to clipboard
Vue loader does not include simple css styles
Let's say we have initial webpack.config.js where options of vue-loader specified as:
{
test: /\.vue$/,
loader: "vue-loader",
options: {
preserveWhitespace: false,
loaders: {
scss: "vue-style-loader!css-loader!sass-loader", // <style lang="scss">
sass: "vue-style-loader!css-loader!sass-loader?indentedSyntax" // <style lang="sass">
}
}
}
and in VueApp/idontneedtypescript/App.vue styles specified without lang="scss":
<style scoped>
.custom-class {
background: red;
}
</style>
Then vue-loader does not include simple css styles in extracted css file in wwwroot/dist/css/main.css.
Hello,
I can confirm that this is indeed an issue.
Styles added in the <style scoped> block are not included correctly and therefore do not work.
CURRENT WORKAROUND: Put your style in any .css file and simply import it, it will work as intended.
I will update the webpack configuration in the coming days.
Thank you for reporting this!