webpack编译成功,但提取文本插件没有导出内容

时间:2017-07-19 12:40:56

标签: webpack webpack-dev-server extract-text-plugin extracttextwebpackplugin

这是我的webpack配置:

const ExtractTextPlugin = require("extract-text-webpack-plugin");

module.exports = {
  entry: {
    index: [
      "webpack-dev-server/client?http://localhost:8081",
      "./components/index.js"
    ]
  },
  output: {
    filename: './build/dist.js'
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /(node_modules|bower_components)/,
        use: 'babel-loader'
      },
      {
        test: /\.css$/,
        use: ExtractTextPlugin.extract(
          {
            fallback: "style-loader",
            use: {
              loader: "css-loader",
              options: {
                modules: true,
                localIdentName: "[path][name]__[local]--[hash:base64:5]"
              }
            },
          }
        )
      }
    ]
  },
  plugins: [new ExtractTextPlugin("./build/dist.css", {allChunks: true})]
};

webpack成功完成了 enter image description here

但我找不到dist.css文件,也无法在Everything软件搜索结果中找到它。

之前唯一奇怪的事情是webpack错误说无法找到Extract Text Plugin的模块,但是在我用本地npm install安装后,它就解决了。

webpack的其他部分工作正常,即使是现在,当我修改js时,它将livereload以显示正确的js文件页面。

谢谢,如果有人可以帮助我。

1 个答案:

答案 0 :(得分:1)

webpack-dev-server将文件保存在memery中。 您可以在package.json中添加另一个脚本而不使用webpack-dev-server

  "scripts": {
      "build-dev": "webpack --config ./dev.webpack.js"
  }

并且不要使用此条目webpack-dev-server/client?http://localhost:8081。使用对象属性。 https://webpack.js.org/configuration/dev-server/