Skip to content

easy-team/easywebpack-cli

Repository files navigation

easywebpack-cli


NPM version build status Test coverage David deps npm download

A Powerful Cross-platform Webpack CLI Tool

Installation

  • easywebpack-cli@5 -> easywebpack@5 (>=Node 8 + Babel 7)
npm i easywebpack-cli -g
  • @easy-team/easywebpack-cli@4 -> @easy-team/easywebpack@4 (>=Node 6 + Babel 7)
npm i @easy-team/easywebpack-cli -g
  • easywebpack-cli@4 -> easywebpack@4 (>=Node 6 + Babel 6)
npm i easywebpack-cli -g

Features

  • ✔︎ Provide easywebpack and webapck development and build capabilities
  • ✔︎ Provide multiple types of project initialization, such as React, Vue, Egg projects
  • ✔︎ Provide multiple types of project builds, such as React, Vue, Egg, Weex projects
  • ✔︎ Provide webpack basic development and build capabilities, such as dev server, hot-reload, typescript, dll
  • ✔︎ Enhance Webpack-based development and build capabilities, such as build speed, build size capabilities
  • ✔︎ Provide easywebpack solution development and build capabilities
  • ✔︎ Built-in normal development commands, such easy clean, easy open, easy kill, easy server

Documents

Command

Support easywebpack and webpack modes,default easywebpack mode, you can specify the wepback build mode by --webpack. Default read ${root}/webpack.config.js webpack config file.

  • easywebpack mode: use easywebpack webpack config
  • Webpack mode: use native webpack config
easy -h

Usage: easy [command] [options]

Options:

-v, --version output the version number -f, --filename [path] webpack config file path -p, --port [port] webpack server port -s, --size [option] webpack build size analyzer tool, support size: analyzer and stats, default analyzer --dll only webpack dll config --web only webpack web config --node only webpack node config --speed stat webpack build speed --devtool [devtool] webpack devtool config -h, --help output usage information 

Commands:

init [options] init webpack config or boilerplate for Vue/React/Weex install [options] dynamic install easywebpack missing npm module upgrade [options] upgrade project package to latest version print [options] [env] print webpack config, support print by env or config node key dll [env] webpack dll build build [options] [env] webpack building server [options] static file web http server dev [env] start webpack dev server for develoment mode start [env] start webpack dev server for develoment mode zip [options] archive files to zip file tar [options] archive files to tar file deploy upload file to deplay space upgrade upgrade webpack and npm package clean [dir] webpack cache dir clean, if dir == "all", will clean cache dir and build dir open [dir] open webpack cache dir kill [port] kill port process, default will kill 7001, 9000, 9001 

Project Initialization

  • easy init

step one:

step one

step two:

step two

Add Component/Config

easy add

从列表中选择指定模板

easy add 

从列表中选择 React 相关模板

easy add --template react

直接初始化模板

easy add --template react-component

自定义模板路径/文件名

easy add --template react-component --dist src/components --output Test.jsx

Project Development

easywebpack

  • easy dev

  • easy dev -f build/webpack.config.js

webpack

  • easy dev --webpack

  • easy dev -f build/webpack.config.js --webpack

Project Building

easywebpack

  • easy build prod

  • easy build -f build/webpack.config.js

webpack

  • easy build -f build/webpack.config.js --webpack

Upgrade

  • upgrade webpack3 to webpack4
easy upgrade
  • upgrade egg project to webpack4
easy upgrade --egg
  • upgrade babel 6 to babel 7
easy upgrade --babel

Puppeteer Html Prerender

easy puppeteer --url http://49.233.172.37:7001/csr

Clean Cache

easy clean

Open Directory

easy open

Kill Port

easy kill 7001 easy kill 7001,9000,9001

Webpack Build Size

easy-build-s

https://www.yuque.com/easy-team/easywebpack/pdwchd

  • webpack-bundle-analyzer
easy build -s 
  • stats-webpack-plugin
easy build -s stats

Webpack Build Speed

Use the plugin speed-measure-webpack-plugin for build speed analysis and count the time spent on each loader and plugin

easy build --speed

Start Web HTTP Server

Use the plugin node-http-server for local directory compilation access, automatically find HTML files

easy server

  • serve current dir
easy server
  • serve specify port and directory
easy server -p 8888 -d dist

Print Webpack Config Info

easy print -h

Usage: print [env] [options]

print webpack config, support print by env or config node key 

Options:

-k, --key [name] print webpack config info by config key name, example: [module/module.rules/plugins] and so on -h, --help output usage information 
  • easy print -k module

  • easy print dev -k entry

  • easy print test -k module.rules

  • easy print prod -k module.rules[0]

  • easy print -k plugins

  • easy print -k plugins[0]

  • easy print -k output

  • easy print -k resolve

Extend Webpack CLI

  • res-cli Res Node Web Framework Command CLI

  • ves-cli Ves Node Web Framework Command CLI

Contributors ✨

Thanks goes to these wonderful people (emoji key):


sky

💻 📖

jasonjcpeng

💻 📖

Kevin Zhong

💻 📖

HiuYanChong

💻 📖

Mice

💻

hacke2

💻

This project follows the all-contributors specification. Contributions of any kind welcome!

License

MIT