Javascript 网页包和外部（供应商）.css

我正在慢慢地将Webpack引入到现有的项目中。在这一点上，我们不需要

文件。不过，我希望Webpack仍能处理它们

我希望Webpack只加载文件，将其传递给所需的任何.css加载程序（在我们的例子中是手写笔），然后输出一个.css文件

ExtractTextPlugin、原始和文件加载器、将加载器传递到其他加载器的组合都不起作用，Webpack不可避免地抛出

Module build failed: ParseError: ...bootstrap-theme.min.css:5:1996
   1| /*!
   2|  * Bootstrap v3.3.5 (http://getbootstrap.com)
   3|  * Copyright 2011-2015 Twitter, Inc.
...
expected "indent", got ";"

甚至可以用这样的网页处理外部文件吗

尝试了各种组合：

  {
    test:   /\.(styl|css)/,
    loader: 'raw!stylus'
  }

  {
    test:   /\.(styl|css)/,
    loader: 'file!stylus'
  }


  {
    test:   /\.(styl|css)/,
    loader: ExtractTextPlugin.extract('file', 'raw!stylus')
  }


  {
    test:   /\.(styl|css)/,
    loader: ExtractTextPlugin.extract('style-loader', 'css-loader!stylus-loader')
  }

您不需要通过手写笔加载程序传递css文件，只需要.styl文件

我已设法使其与此配置一起工作：

module.exports = {
  entry: {
    name: './test.js'
  },
  output: {
    filename: './bundle.js'
  },
  module: {
    loaders: [
      {
        test: /\.css$/,
        loaders: ['style', 'css']
      },
      {
        test: /\.styl$/,
        loaders: ['style', 'css', 'stylus']
      },
      {
        test:/\.(woff2?|eot|ttf|svg)$/,
        loader: 'url'
      }
    ]
  }
}

然后您可以导入/要求css文件，如下所示：

require('./test.css');
require('./node_modules/bootstrap/dist/css/bootstrap.min.css');

您还可以添加CSS作为
name
的额外入口点：

module.exports = {
  entry: {
    name: [
      './test.js',
      './test.css',
    ],
  },
  /* … */
};

事情就是这样：我还不想
要求他们。但是，我想，用webpack是没办法的