Webpack sass где находится css файл

Я использую веб-пакет с загрузчиком sass следующим образом:

module.exports = {
  module: {
    loaders: [
      {
        test: /.scss$/,
        loader: "style!css!sass"
      }
    ]
  }
};

но я вижу, что стили применяются к тегу стиля, где находится файл generate css?

2 62
javascript node.js webpack sass

2 ответа:

по умолчанию загрузчик стилей вставляет скомпилированный css в ваш пакет, который добавляется в начало страницы с выходным файлом, например bundle.js. Используя extract-text-webpack-plugin вы можете удалить скомпилированный CSS из пакета, и экспортировать его в отдельный файл.

первый-оберните загрузчик в плагин:

 loaders: [{
  test: /\.scss$/,
  loader: ExtractTextPlugin.extract(
    "style",
    "css!sass")
 }]
},

затем скажите плагину, как назвать файл, который он генерирует:

plugins: [
    new ExtractTextPlugin("app.css")
 ]

включите этот файл в свой HTML обычно.

87

Если вы хотите отдельный файл CSS при использовании Webpack, вам нужно использовать extract-text-webpack-plugin.

6