繁体   English   中英

webpack不包含CSS文件

[英]webpack does not include css file

我已经建立了一个反应步进器,并将其上传到github。 当我想构建我的App时,webpack不包含超棒的CSS。 但是它包括我自己的style.scss文件。 我在webpack中使用样式加载器。 在开发模式下,一切正常。 仅在构建模式下不起作用。 这是我的仓库:

https://github.com/tkwant/react-stepper-wizard

这是我的webpack.build.config文件:

const webpack = require("webpack");
const CleanWebpackPlugin = require("clean-webpack-plugin");

module.exports = {
  entry: "./src/index.js",
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        use: ["babel-loader"]
      },
      {
        test: /\.(scss|css)$/,
        use: [
          {
            loader: "style-loader" // creates style nodes from JS strings
          },
          {
            loader: "css-loader" // translates CSS into CommonJS
          },
          {
            loader: "sass-loader" // compiles Sass to CSS
          }
        ]
      },
      {
        test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
        loader: "url-loader?limit=10000&mimetype=application/font-woff"
      },
      {
        test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
        loader: "file-loader"
      }
    ]
  },
  resolve: {
    extensions: ["*", ".js", ".jsx"]
  },
  output: {
    path: __dirname + "/dist",
    publicPath: "/",
    filename: "react-stepper-wizard.js",
    library: "Stepper",
    libraryTarget: "umd"
  },
  externals: ["react", "react-dom", "font-awesome"],
  plugins: [
    new CleanWebpackPlugin(["dist"]),
    new webpack.HotModuleReplacementPlugin()
  ],
  devtool: "source-map",
  devServer: {
    contentBase: "./examples",
    hot: true,
    port: 9001
  }
};

如果有人可以在这里帮助我或者可以进行PR来解决此问题,那将是很好的。

您正在复制.css文件,对吗? 您可能要尝试使用webpack-copy-plugin

解决方案是使用网址加载程序。

 { test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader" },
  { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader" },

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM