@axew/jugg
A front-end scaffold 🛠️ work with Webpack.
Last updated a month ago by daief .
MIT · Repository · Original npm · Tarball · package.json
$ cnpm install @axew/jugg 
SYNC missed versions from official npm registry.

Jugg

What is Jugg?

A front-end scaffold ????️ work with Webpack.

basic command

# start a webpack-dev-server
$ jugg dev

# build with webpack
$ jugg build

jugg dev

$ jugg dev -h
Usage: dev [options]

start dev server

Options:
  -p, --port [port]              dev server port
  --noDevClients [noDevClients]  when set, do not add dev clients to webpack entry  (default: false)
  -h, --help                     output usage information

Since webpack-dev-server v3.2.0, automatically add the HMR plugin when hot or hotOnly is enabled. Can set noDevClients to disable built-in config to entry.

jugg build

$ jugg build -h
Usage: build [options]

exec build

Options:
  -h, --help  output usage information

directory

Simple directory can be something like this, default entry can be src/index.{tsx?|jsx?}. tsconfig.json is necessary only when you use TypeScript.

.
├── src
│   └── index.ts
└── tsconfig.json

config

Create a file named .juggrc.js, .juggrc.ts, jugg.config.js, etc. Or write config object in package.json.

interface JuggConfig {
  /**
   * publicPath of webpack, default '/'
   */
  publicPath?: string;
  /**
   * output path of webpack, default 'dist'
   */
  outputDir?: string;
  plugins?: PluginCfgSchema[];
  define?: { [k: string]: any };
  /**
   * open chunks config? default true
   */
  chunks?: boolean;
  /**
   * sourceMap, default true
   */
  sourceMap?: boolean;
  webpack?: JuggWebpack;
  /**
   * ts-loader custom transformers, only work when ts-loader is enabled
   */
  tsCustomTransformers?: {
    before?: PluginCfgSchema[];
    after?: PluginCfgSchema[];
  };
  /**
   * set bundle file name in production env, default `[name].[chunkhash]`.
   * affect js, css.
   */
  filename?: string;
  /**
   * built-in base webpack html plugin config.
   * set false to rm plugin.
   */
  html?: false | KeyValuePair;
  /**
   * config of css, less, postcss...
   */
  css?: {
    loaderOptions?: {
      /**
       * https://github.com/webpack-contrib/css-loader#options
       */
      css?: any;
      /**
       * http://lesscss.org/usage/#command-line-usage-options
       */
      less?: any;
      /**
       * https://github.com/postcss/postcss-loader/tree/v3.0.0#options
       * when `false`, disable the `postcss`
       */
      postcss?:
        | {
            config?: {
              context?: any;
              path?: any;
            };
            /**
             * when `false`, disable built-in plugins
             */
            plugins?: any;
            [k: string]: any;
          }
        | false;
    };
  };
  /**
   * add dependencies to compile by ts-loader or babel
   * if item is string, it will be convert a regex such as `join('node_modules', item, '/')`
   * @since 0.1.1
   */
  transpileDependencies?: Array<string | RegExp> | ((pth: string) => boolean);
}

type JuggWebpack = webpack.Configuration | (
  param: {
    config: webpackChain.Config;
    webpack: webpack.Configuration;
  }
) => void | webpack.Configuration;

type PluginCfgSchema = string | [string, { [k: string]: any }?];

env

  • ANALYZE
    • enable webpack-bundle-analyzer
  • ANALYZE_PORT
    • webpack-bundle-analyzer server port, default 8888
  • ANALYZE_DUMP
    • generate stats file while ANALYZE_DUMP exist
  • FORK_TS_CHECKER
    • set none, disbale fork-ts-checker-webpack-plugin
  • HARD_SOURCE
    • set none, disbale hard-source-webpack-plugin
  • NO_WEBPACKBAR
    • when opened, remove webpackbar plugin
  • JUGG_TS_PROJECT
    • set a value to assign a specific tsconfig.json

TS or JS

Both TS and JS can be used together in a project with jugg. There are several situations with handleing TS and JS:

  • Default & Recommended: create a tsconfig.json, then jugg will open ts-loader and use it to compile ts, tsx, js, tsx. babel is needless here.
    • ts-loader: ts, tsx, js, jsx
    • babel: needless
  • Set config in .juggrc.js with jugg-plugin-babel. Babel plugin will rewrite built-in config of ts-loader for js and jsx and handle then with itself.
    • ts-loader: ts, tsx
    • babel: js, jsx
  • Set compileTs: true in jugg-plugin-babel config will clean all built-in ts-loader options. Babel handles all the file.
    • ts-loader: cleaned
    • babel: ts, tsx, js, jsx

Notice

  • import() works with "module": "esnext" in tsconfig.json, detail.
    • Use .browserslistrc config or browserslist key in package.json to share target browsers with Babel, ESLint and Stylelint. See Browserslist docs for available queries and default value.
    {
      // previous built-in config
      "browserslist": [
        "last 2 versions",
        "Firefox ESR",
        "> 1%",
        "ie >= 9",
        "iOS >= 8",
        "Android >= 4"
      ]
    }
    

Current Tags

  • 0.2.0                                ...           latest (a month ago)

28 Versions

  • 0.2.0                                ...           a month ago
  • 0.1.2                                ...           4 months ago
  • 0.1.1                                ...           5 months ago
  • 0.1.0                                ...           5 months ago
  • 0.1.0-alpha.1                                ...           6 months ago
  • 0.1.0-alpha.0                                ...           6 months ago
  • 0.0.24                                ...           6 months ago
  • 0.0.23                                ...           6 months ago
  • 0.0.22                                ...           6 months ago
  • 0.0.21                                ...           7 months ago
  • 0.0.20                                ...           7 months ago
  • 0.0.19                                ...           8 months ago
  • 0.0.18                                ...           9 months ago
  • 0.0.17                                ...           10 months ago
  • 0.0.15                                ...           10 months ago
  • 0.0.14                                ...           10 months ago
  • 0.0.13                                ...           10 months ago
  • 0.0.12                                ...           a year ago
  • 0.0.11                                ...           a year ago
  • 0.0.10                                ...           a year ago
  • 0.0.9                                ...           a year ago
  • 0.0.8                                ...           a year ago
  • 0.0.7                                ...           a year ago
  • 0.0.6                                ...           a year ago
  • 0.0.4                                ...           a year ago
  • 0.0.3                                ...           a year ago
  • 0.0.2                                ...           a year ago
  • 0.0.1 [deprecated]           ...           a year ago
Maintainers (1)
Downloads
Today 1
This Week 1
This Month 31
Last Day 0
Last Week 30
Last Month 102
Dev Dependencies (5)
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |