# webpack-config-filter

> webpack配置简化工具

Latest version **1.0.1** (published 2019-07-06) · ISC license · 0 weekly downloads

## Install

```sh
npm install webpack-config-filter
pnpm add webpack-config-filter
yarn add webpack-config-filter
bun add webpack-config-filter
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2019-07-06 |
| First published | 2019-07-06 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 3.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | weiyinfu |
| Maintainers | weiyinfu |

## Links

- npm: https://www.npmjs.com/package/webpack-config-filter
- Repository: https://github.com/weiyinfu/webpackConfigFilter
- Homepage: https://github.com/weiyinfu/webpackConfigFilter#readme
- Issues: https://github.com/weiyinfu/webpackConfigFilter/issues
- npm.io page: https://npm.io/package/webpack-config-filter

## Recent versions

- 1.0.1 (latest) — 2019-07-06

## README

在 webpack 中可以使用条件语句

一个例子  
webpack.config.js

```js
const webpackConfig = {
  mode: mode,
  entry: {
    //entry通过扫描pages下的目录自动生成
  },
  output: {
    path: distPath,
    filename: "[name].js"
  },
  module: {
    rules: [
      {
        test: /\.vue$/,
        loader: "vue-loader"
      },
      {
        test: /\.css$/,
        use: ["vue-style-loader", "css-loader"]
      },
      {
        test: /\.less$/,
        use: ["vue-style-loader", "css-loader", "less-loader"]
      },
      {
        test: /\.(png|jpg|gif|svg|ttf|woff)$/,
        loader: "url-loader",
        options: {
          name: "[name].[ext]?[hash]",
          limit: 8192
        }
      }
    ]
  },
  resolve: {
    extensions: [".js", ".vue", ".json"],
    alias: {
      vue: "vue/dist/vue.js"
    }
  },
  node: {
    fs: "empty"
  },
  plugins: [
    new VueLoaderPlugin(),
    new webpack.HotModuleReplacementPlugin(),
    new CopyWebpackPlugin([
      {
        from: path.join(__dirname, "./public")
      }
    ]),
    {
      condition: production,
      ifTrue: new CompressionWebpackPlugin({
        test: new RegExp("\\.(" + ["js", "css"].join("|") + ")$"),
        // asset: "[path].gz[hash]",
        algorithm: "gzip",
        threshold: 10240,
        minRatio: 0.8
      })
    }
  ],
  devServer: {
    contentBase: distPath,
    proxy: {
      "/api": "http://localhost:8080"
    },
    port: 8000,
    hot: true,
    host: "0.0.0.0",
    disableHostCheck: true,
    historyApiFallback: {
      rewrites: [{ from: /^\/$/, to: "/Index.html" }]
    }
  },
  externals: {
    condition: production,
    ifTrue: {
      vue: "Vue",
      "element-ui": "ELEMENT",
      "vue-router": "VueRouter"
    },
    ifFalse: {}
  }
}
module.exports = webpackConfigFilter(webpackConfig)
```

---
_Source: https://npm.io/package/webpack-config-filter · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._