i use stylus ,
min.styl
$main-color = #000000
App.vue
@import "../assets/min.styl"
Holle.vue
.button
$main-color
holle.vue can't find $main-color
what can i do
Please ask questions on the forum or StackOverflow.
I think you have to import the stylus file in the style section
@posva I don't want to do in every vue file,Is any other way to do
Not that I know. You should search about how to do it in plain stylus
files, but it's not related to Vue
On Fri, 21 Apr 2017, 05:48 BusyHe, notifications@github.com wrote:
@posva https://github.com/posva I don't want to do in every vue file,Is
any other way to do—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/vuejs/vue-cli/issues/441#issuecomment-296046156, or mute
the thread
https://github.com/notifications/unsubscribe-auth/AAoicZyb8cvuiHMFd13j3vlHFb6-WGC1ks5ryCcZgaJpZM4NCluU
.
but it is related to the vue-cli. Importing fonts doesn't work either.
In cli2 webpack's setting like following:
plugins: [
new webpack.LoaderOptionsPlugin({
options: {
stylus: {
import: [path.resolve(__dirname, '../src/stylus/variables.styl'), path.resolve(__dirname, '../src/stylus/extends.styl')]
}
}
})
]
In cli3 you can add file 'vue.config.js' and handle your webpack's setting like:
// vue.config.js
var path = require('path')
var webpack = require('webpack')
module.exports = {
configureWebpack: {
plugins: [
new webpack.LoaderOptionsPlugin({
options: {
stylus: {
import: [path.resolve(__dirname, './src/stylus/variables.styl'), path.resolve(__dirname, './src/stylus/extends.styl')]
}
}
})
]
}
}
It works for me.
I just wanted to leave a note to say @sky790312 's comment above helped me figure this out.
My vue.config.js
which works
// vue.config.js
var path = require('path');
module.exports = {
css: {
loaderOptions: {
stylus: {
import: [path.resolve(__dirname, "src/stylus/variables")]
}
}
}
};
How to import once
Most helpful comment
I just wanted to leave a note to say @sky790312 's comment above helped me figure this out.
My
vue.config.js
which works