# whistle-webpack > webpack package Latest version **1.0.10** (published 2020-04-05) · ISC license · 0 weekly downloads ## Install ```sh npm install whistle-webpack pnpm add whistle-webpack yarn add whistle-webpack bun add whistle-webpack ``` Provides the command `whistle-webpack`. ## 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.10 | | Published | 2020-04-05 | | First published | 2020-03-22 | | Weekly downloads | 0 | | License | ISC | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 41 | | Unpacked size | 490.9 KB | | Known vulnerabilities | 0 (+6 in 1 direct dependencies) | | Install scripts | no | | GitHub stars | 1 | | Maintainers | yyscc | ## Links - npm: https://www.npmjs.com/package/whistle-webpack - Repository: https://github.com/BobiY/whistle-webpack - Homepage: https://github.com/BobiY/whistle-webpack#readme - Issues: https://github.com/BobiY/whistle-webpack/issues - npm.io page: https://npm.io/package/whistle-webpack ## Dependencies (41) - [glob](https://npm.io/package/glob.md) ^7.1.6 - [less](https://npm.io/package/less.md) ^3.11.1 - [husky](https://npm.io/package/husky.md) ^4.2.3 - [colors](https://npm.io/package/colors.md) ^1.4.0 - [cssnano](https://npm.io/package/cssnano.md) ^4.1.10 - [webpack](https://npm.io/package/webpack.md) ^4.42.0 - [prettier](https://npm.io/package/prettier.md) 2.0.2 - [css-loader](https://npm.io/package/css-loader.md) ^3.4.2 - [url-loader](https://npm.io/package/url-loader.md) ^4.0.0 - [webpackbar](https://npm.io/package/webpackbar.md) ^4.0.0 - [@babel/core](https://npm.io/package/@babel/core.md) ^7.9.0 - [file-loader](https://npm.io/package/file-loader.md) ^6.0.0 - [less-loader](https://npm.io/package/less-loader.md) ^5.0.0 - [webpack-cli](https://npm.io/package/webpack-cli.md) ^3.3.11 - [autoprefixer](https://npm.io/package/autoprefixer.md) ^9.7.4 - [babel-loader](https://npm.io/package/babel-loader.md) ^8.1.0 - [webpack-chain](https://npm.io/package/webpack-chain.md) ^6.4.0 - [webpack-merge](https://npm.io/package/webpack-merge.md) ^4.2.2 - [postcss-loader](https://npm.io/package/postcss-loader.md) ^3.0.0 - [@babel/preset-env](https://npm.io/package/@babel/preset-env.md) ^7.9.0 - [webpack-dev-server](https://npm.io/package/webpack-dev-server.md) ^3.10.3 - [@babel/preset-react](https://npm.io/package/@babel/preset-react.md) ^7.9.1 - [html-webpack-plugin](https://npm.io/package/html-webpack-plugin.md) ^4.0.0-beta.14 - [clean-webpack-plugin](https://npm.io/package/clean-webpack-plugin.md) ^3.0.0 - [terser-webpack-plugin](https://npm.io/package/terser-webpack-plugin.md) ^2.3.5 - [@babel/runtime-corejs3](https://npm.io/package/@babel/runtime-corejs3.md) ^7.9.2 - [mini-css-extract-plugin](https://npm.io/package/mini-css-extract-plugin.md) ^0.9.0 - [webpack-manifest-plugin](https://npm.io/package/webpack-manifest-plugin.md) ^2.2.0 - [@babel/preset-typescript](https://npm.io/package/@babel/preset-typescript.md) ^7.9.0 - [html-webpack-tags-plugin](https://npm.io/package/html-webpack-tags-plugin.md) ^2.0.17 - [filemanager-webpack-plugin](https://npm.io/package/filemanager-webpack-plugin.md) ^2.0.5 - [friendly-errors-webpack-plugin](https://npm.io/package/friendly-errors-webpack-plugin.md) ^1.7.0 - [@babel/plugin-transform-runtime](https://npm.io/package/@babel/plugin-transform-runtime.md) ^7.9.0 - [@babel/plugin-proposal-decorators](https://npm.io/package/@babel/plugin-proposal-decorators.md) ^7.8.3 - [optimize-css-assets-webpack-plugin](https://npm.io/package/optimize-css-assets-webpack-plugin.md) ^5.0.3 - [@babel/plugin-proposal-function-bind](https://npm.io/package/@babel/plugin-proposal-function-bind.md) ^7.8.3 - [@babel/plugin-proposal-do-expressions](https://npm.io/package/@babel/plugin-proposal-do-expressions.md) ^7.8.3 - [@babel/plugin-transform-destructuring](https://npm.io/package/@babel/plugin-transform-destructuring.md) ^7.8.8 - [@babel/plugin-proposal-class-properties](https://npm.io/package/@babel/plugin-proposal-class-properties.md) ^7.8.3 - [@babel/plugin-proposal-pipeline-operator](https://npm.io/package/@babel/plugin-proposal-pipeline-operator.md) ^7.8.3 - [@babel/plugin-proposal-export-default-from](https://npm.io/package/@babel/plugin-proposal-export-default-from.md) ^7.8.3 ## Recent versions - 1.0.10 (latest) — 2020-04-05 - 1.0.9 — 2020-03-28 - 1.0.8 — 2020-03-25 - 1.0.7 — 2020-03-24 - 1.0.6 — 2020-03-24 - 1.0.5 — 2020-03-24 - 1.0.4 — 2020-03-24 - 1.0.3 — 2020-03-23 - 1.0.2 — 2020-03-23 - 1.0.1 — 2020-03-22 - 1.0.0 — 2020-03-22 ## README # whistle-webpack ### 安装 ~~~ yarn add whistle-webpack -D ~~~ ### 使用 **目录结构** 1. 单入口文件 ~~~ src | |-index.(js|jsx|ts|tsx) ~~~ 如果想使用 `react`，需要自行安装 `react` 和 `react-dom`, 默认支持 react 编译 2. 多入口文件 ~~~ src | |-index | |-index.js |-search| |-index.js ~~~ 会自动读取`./src/index.(js|jsx|ts|tsx)` 或者 `./src/**/index.(js|jsx|ts|tsx)` ### 关于模式 提供三种模式，分别如下： - build 模式，用于生产环境的打包 - dev-server 模式，用于本地开发 - watch 模式，类似于 `webpack --watch` 全局安装 ~~~ npm intall -g whistle-webpack ~~~ 通过命令行参数指定 ~~~ // 生产打包 whistle-webpack --mode build // 或 whistle-webpack // 本地开发 whistle-webpack --mode dev-server --port 3000 // 默认开发端口是 8080 // 监听模式 whistle-webpack --mode watck ~~~ 或者文件夹下安装，在 package.json 中添加 ~~~ "script": { "build": "whistle-webpack", "dev": "whistle-webpack --mode dev-server --port 3000", "watch": "whistle-webpack --mode watck" } ~~~ ### 自己的配置文件 如果想扩展包中包含的三种模式的配置文件，可以这样做 ~~~ const webpackMerge = require('webpack-merge'); const devConfig = require('whistle-webpack')('development'); // 开发阶段配置 const prodConfig = require('whistle-webpack')('production'); // 生产阶段配置 const watchConfig = require('whistle-webpack')(); // 基础配置 const selfConfig = { plugins: [] } module.exports = webpackMerge(/任意模式的配置/， selfConfig); ~~~ 接下来在命令行中输入 ~~~ whistle-webpack --config ./self.webpack.config.js ~~~ --- _Source: https://npm.io/package/whistle-webpack · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._