Question

我正在尝试让Webpack编译我的手写笔文件，它会将它们全部导入，但它似乎没有将任何内容编译成CSS。

这是我的Webpack配置文件：

const webpack = require('webpack')
const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const CleanWebpackPlugin = require('clean-webpack-plugin')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const FaviconsWebpackPlugin = require('favicons-webpack-plugin')

const jeet = require('jeet')
const rupture = require('rupture')
const autoprefixer = require('autoprefixer-stylus')

module.exports = {
  entry: {
    app: './src/app.js',
    vendor: [
      'lodash'
    ]
  },
  devtool: 'inline-source-map',
  output: {
    // name will match each entry point above and 'chunkchash' will ensure each new build doesn't cache
    filename: '[name].[chunkhash].js',
    path: path.resolve(__dirname, 'dist')
  },
  module: {
    rules: [
      // Process css styles
      {
        test: /\.styl$/,
        use: ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: [
            'css-loader', 'stylus-loader'
          ]
        })
      }
    ]
  },
  plugins: [
    // Delete old build so we have a fresh start each time
    new CleanWebpackPlugin(['dist']),
    // Process styles
    new webpack.LoaderOptionsPlugin({
      options: {
        stylus: {
          use: [
            jeet(),
            rupture(),
            autoprefixer({ browsers: ['> 3%'] })
          ]
        },
        context: '/'
      }
    }),
    // Don't inject the styles as a style tag, extract them into core.css
    new ExtractTextPlugin('core.css'),
    // Generate all our site icons
    // Generate our HTML files for us
    new HtmlWebpackPlugin({
      template: './src/app.html',
      filename: 'index.html',
      inject: 'body'
    }),
    // Prevent unchanging modules from updating their hash
    new webpack.HashedModuleIdsPlugin(),
    // Put common vendor chunks into their own bundle
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor'
    }),
    // Put common internal chunks into their own bundle
    new webpack.optimize.CommonsChunkPlugin({
      name: 'common'
    })
  ]
}

为了简洁起见，我删除了一些非样式相关的加载器，webpack.dev.js和webpack.prod.js中还有其他非样式相关的东西。

正如其他人对其他帖子发表评论一样，手写笔加载器文档非常糟糕，我已经查看了很多资源，现在我无法分辨哪些部分是Webpack 1，哪些部分是Webpack 2或3。

我正在使用Webpack v3.6.0，但如果我的问题可以通过切换到2来解决，我很乐意这样做。

Stylus-loader没有编译Webpack 3中的文件

0 个答案: