i'm trying to activate sourcemaps for everything on my cli3 project.
so far i have
vue.config.js
module.exports = {
css: {
loaderOptions: {
css: {
sourceMap: true
},
sass: {
sourceMap: true
},
stylus: {
sourceMap: true
},
postcss: {
sourceMap: true
}
}
},
devServer: { port: 8888 },
configureWebpack: {
devtool: 'cheap-module-eval-source-map',
// ...
according to this https://cli.vuejs.org/config/#css-sourcemap, there is no more option except less (which i don't use).
now vue inspect
gives me:
{
loader: 'vue-style-loader',
options: {
sourceMap: false,
shadowMode: false
}
},
{
loader: 'css-loader',
options: {
sourceMap: true,
importLoaders: 2
}
},
{
loader: 'postcss-loader',
options: {
sourceMap: true
}
},
{
loader: 'sass-loader',
options: {
sourceMap: true,
implementation: {
run_: function() {
return _call(f, Array.prototype.slice.apply(arguments));
},
render: function() {
return _call(f, Array.prototype.slice.apply(arguments));
},
renderSync: function() {
return _call(f, Array.prototype.slice.apply(arguments));
},
info: 'dart-sass\t1.22.9\t(Sass Compiler)\t[Dart]\ndart2js\t2.4.0\t(Dart Compiler)\t[Dart]',
types: {
Boolean: function() {
return _call(f, Array.prototype.slice.apply(arguments));
},
Color: function() {
return _call(f, this, Array.prototype.slice.apply(arguments));
},
List: function() {
return _call(f, this, Array.prototype.slice.apply(arguments));
},
Map: function() {
return _call(f, this, Array.prototype.slice.apply(arguments));
},
Null: function() {
return _call(f, Array.prototype.slice.apply(arguments));
},
Number: function() {
return _call(f, this, Array.prototype.slice.apply(arguments));
},
String: function() {
return _call(f, this, Array.prototype.slice.apply(arguments));
},
Error: function Error() { [native code] }
}
},
indentedSyntax: true
}
how can I activate sourcemaps for vue component styles? also, configurewebpack.devtool seems to have no effect at all. (or does it only have an effect when paired with loaderOptions?)
thanks :)