css source maps

[IdanCo]

Hi,

All CSS attributes in chrome inspector points to without any reference to the original files. any idea why or how to fix?

{ "generator-fountain-angular1": { "version": "1.0.0-rc2", "props": { "css": "scss", "resolved": "/Users/idancohen/.nvm/versions/node/v4.2.4/lib/node_modules/generator-fountain-webapp/node_modules/generator-fountain-angular1/generators/app/index.js", "framework": "angular1", "argv": { "remain": [], "cooked": [], "original": [] }, "js": "babel", "modules": "webpack", "ci": [], "namespace": "fountain-angular1", "sample": "techs", "router": "uirouter" } } }

Node.js v4.2.4 darwin 16.3.0 yo 1.8.5 npm 4.1.1

[solova]

I touched the same. I hope easist solution exists, but I found only this.

1) add ExtractTextPlugin to webpack.conf.js (just copy from webpack-dist)

const ExtractTextPlugin = require('extract-text-webpack-plugin');

2) replace stylesheets section with

{
    test: /\.css$/,
    loaders: [
        'style-loader',
        'css-loader',
        'postcss-loader'
    ]
}, {
    test: /\.scss$/,
    loaders: ExtractTextPlugin.extract({
        fallbackLoader: 'style-loader',
        loader: 'css-loader?sourceMap!sass-loader!postcss-loader'
    })
}

3) add ExtractTextPlugin to plugins section

new ExtractTextPlugin('styles.css')

4) extend LoaderOptionsPlugin options section with

sassLoader: {
  includePaths: [path.resolve(__dirname, 'src', 'scss')]
},
context: '/'

[IdanCo]

it almost worked :-)

Instead of