Могу ли я создать sass/less/css в webpack, не требуя их в моем JS?

В настоящее время у меня есть некоторые реагирующие компоненты и sass, которые строятся с помощью webpack успешно. У меня также есть основной файл sass, который строит css с задачей gulp.

Мне бы хотелось использовать только одну из этих технологий, возможно ли просто скомпилировать sass для css без привязки к sass в файле записи?

Вот пример использования WebpackExtractTextPlugin

webpack.config.js

entry_object[build_css + "style.css"] = static_scss + "style.scss";
module.exports = {
  entry: entry_object,
  output: {
    path: './',
    filename: '[name]'
  },
{
  test: /\.scss$/,
  include: /.scss$/,
  loader: ExtractTextPlugin.extract("style-loader", "css!sass")
}
  plugins: [
    new ExtractTextPlugin("[name]")
  ]

после запуска webpack, свойство style.css выглядит следующим образом:

/******/ (function(modules) { // webpackBootstrap
/******/    // The module cache
/******/    var installedModules = {};
/******/
/******/    // The require function
/******/    function __webpack_require__(moduleId) {

...

Ответы

Ответ 1

Я решил это с помощью @bebraw

Как он заявил в своем комментарии, webpack создаст фиктивный javascript файл, за которым последует шаблон в вашем файле output.filename при использовании ExtractTextPlugin. Поскольку я устанавливал выходной файл ExtractTextPlugin точно так же, как имя в файле output.filename, он выводил только файл javascript. Убедившись, что имя файла output.filename и ExtractTextPlugin не совпадает с именем файла, я смог красиво загрузить sass в css.

Вот окончательный пример webpack.config.js

entry_object[build_css + "style"] = static_scss + "style.scss";
module.exports = {
  entry: entry_object,
  output: {
    path: './',
    filename: '[name]'
  },
{
  test: /\.scss$/,
  include: /.scss$/,
  loader: ExtractTextPlugin.extract("style-loader", "css!sass")
}
  plugins: [
    new ExtractTextPlugin("[name].css")
  ]