與故事書導入scss文件

Question

我目前正面臨故事書的問題。一切都在我的應用程序，webpack工作得很好。故事書似乎有我的配置問題。

這裏是我的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] 
    } 
    }] 
}, 

故事書有問題與解析SCSS文件，我需要創建一個特定webpack.config.js的童話故事來解決這個問題？

在我主要的應用程序，我輸入我的SCSS文件是這樣的：import './styles/base.scss'

Answer 1

我加入了webpack.config.js頗爲相似，我現有的只是工作：

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]' 
      } 
     } 
    } 
    ] 
} 
}