importieren scss-Datei mit Storybook

Question

Ich bin derzeit mit einem Problem mit Storybook konfrontiert. Alles funktioniert großartig in meiner App, mit Webpack. Storybook scheint Probleme mit meiner Konfiguration zu haben.

Hier ist mein webpack.config.js:

module.exports = { 
    entry: './index.js', 
    output: { 
    path: path.join(__dirname, 'dist'), 
    filename: 'bundle.js' 
}, 
module: { 
    loaders: [ 
    { 
     test: /\.js$/, 
     loader: 'babel-loader', 
     exclude: /node_modules/, 
     include: __dirname 
    }, 
    { 
     test: /\.scss$/, 
     use: [ 
     {loader: "style-loader"}, 
     {loader: "css-loader"}, 
     {loader: "sass-loader", 
      options: { 
      includePaths: [__dirname] 
    } 
    }] 
}, 

Bilderbuch haben Problem mit der SCSS Datei Parsen, muss ich eine bestimmte webpack.config.js erstellen müssen für diese Märchenbuch zu lösen?

In meinem Haupt-app ich meine SCSS Datei auf diese Weise importieren: import './styles/base.scss'

Answer 1

I durch Zugabe einer webpack.config.js funktionierte einfach ganz ähnlich wie meiner einer bestehenden:

const path = require('path') 

module.exports = { 
    module: { 
    rules: [ 
    { 
     test: /\.scss$/, 
     loaders: ['style-loader', 'css-loader', 'sass-loader'], 
     include: path.resolve(__dirname, '../') 
    }, 
    { test: /\.css$/, 
     loader: 'style-loader!css-loader', 
     include: __dirname 
    }, 
    { 
     test: /\.(woff|woff2)$/, 
     use: { 
      loader: 'url-loader', 
      options: { 
      name: 'fonts/[hash].[ext]', 
      limit: 5000, 
      mimetype: 'application/font-woff' 
      } 
     } 
    }, 
    { 
     test: /\.(ttf|eot|svg|png)$/, 
     use: { 
      loader: 'file-loader', 
      options: { 
      name: 'fonts/[hash].[ext]' 
      } 
     } 
    } 
    ] 
} 
}