Skip to content

Commit

Permalink
refactor(cli): allow loader bypass, independent tsconfig (#7)
Browse files Browse the repository at this point in the history 
* cli, lang change to loader
* ts, index, allow independent tsconfig opt
* wp, wpConfigs separate preprocessLoader function
  • Loading branch information
@cdcabrera
cdcabrera committed Jan 9, 2024
1 parent f607b2e commit 0f1d643
Show file tree
Hide file tree
Showing 14 changed files with 1,371 additions and 203 deletions.
20 changes: 10 additions & 10 deletions DOCS.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,16 +19,16 @@ $ weldable -h
```

#### Options
| CLI OPTION | DESCRIPTION | CHOICES | DEFAULT |
|----------------|--------------------------------------------------------------------------------------------------------------------------------------------------|------------------------------------------------------------------------|--------------|
| -e, --env | Use a default configuration type if NODE_ENV is not set to the available choices of "development" and "production" | development, production | production |
| -l, --lang | Codebase language, JS or TS | js, ts | js |
| -s, --stats | Output JSON webpack bundle stats for use with "webpack-bundle-analyzer". Use the default or enter a relative path and filename | | ./stats.json |
| --tsconfig | Generate a base tsconfig from one of the available NPM @tsconfig/[base]. An existing tsconfig.json will override this option, see "tsconfig-opt" | create-react-app, node18, node20, react-native, recommended, strictest | |
| --tsconfig-opt | Regenerate or merge a tsconfig. Useful if a tsconfig already exists | merge, regen | regen |
| -x, --extend | Extend, or override, the default configs with your own relative path webpack configs using webpack merge. | | |
| -h, --help | | | |
| -v, --version | | | |
| CLI OPTION | DESCRIPTION | CHOICES | DEFAULT |
|----------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|------------------------------------------------------------------------|--------------|
| -e, --env | Use a default configuration type if NODE_ENV is not set to the available choices of "development" and "production" | development, production | production |
| -l, --loader | Preprocess loader, use the classic JS (babel-loader), TS (ts-loader), or "none" to use webpack defaults, or a different loader. | js, ts, none | js |
| -s, --stats | Output JSON webpack bundle stats for use with "webpack-bundle-analyzer". Use the default or enter a relative path and filename | | ./stats.json |
| --tsconfig | Generate a base tsconfig from one of the available NPM @tsconfig/[base]. An existing tsconfig.json will override this option, see "tsconfig-opt". This option can be run without running webpack. | create-react-app, node18, node20, react-native, recommended, strictest | |
| --tsconfig-opt | Regenerate or merge a tsconfig. Useful if a tsconfig already exists. Requires the use of "tsconfig" option | merge, regen | regen |
| -x, --extend | Extend, or override, the default configs with your own relative path webpack configs using webpack merge. | | |
| -h, --help | | | |
| -v, --version | | | |

#### NPM script use
CLI usage can be placed under NPM scripts
Expand Down
15 changes: 9 additions & 6 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,15 +5,17 @@

Default webpack development and production configuration.

The goal of `weldable` was to make it easier to install `webpack` build packages and be up and running with a basic
`development` or `production` server with minimal preferences.
The goal of `weldable` is to make it easier to install `webpack` build packages and be up and running with a basic
`development` or `production` build with minimal preferences.

`weldable` is intended...

- To be used for basic webpack development and production builds.
- To be quickly used for basic webpack development and production builds.
- To purposefully not include webpack configurations for linting and styling aspects beyond basic webpack capabilities.
- To be designed with the expectation that you can expand on the `weldable` base using the CLI extend option. `-x ./webpack.exampleConfig.js`.
- To be used as a build resource with exposed webpack plugins/addons. And without the need to reinstall available webpack packages (or at least the ones `weldable` uses).
- To be used as a single build resource with exposed webpack plugins/addons. And without the need to reinstall available webpack packages (or at least the ones `weldable` uses).

[If weldable doesn't work for you, you can always go back to the `webpack` project `init` command](https://webpack.js.org/configuration/#set-up-a-new-webpack-project)

## Requirements
The basic requirements:
Expand Down Expand Up @@ -50,11 +52,12 @@ For in-depth use of `weldable` see our [DOCS](./DOCS.md).
Options:
-e, --env Use a default configuration type if NODE_ENV is not set to the available choices.
[string] [choices: "development", "production"] [default: "production"]
-l, --lang Codebase language, JS or TS [string] [choices: "js", "ts"] [default: "js"]
-l, --loader Preprocess loader, use the classic JS (babel-loader), TS (ts-loader), or "none" to use webpack defaults, or a
different loader. [string] [choices: "none", "js", "ts"] [default: "js"]
-s, --stats Output JSON webpack bundle stats. Use the default, or a relative project path and filename [./stats.json]
[string]
--tsconfig Generate a base tsconfig from NPM @tsconfig/[base]. An existing tsconfig.json will override this option, see
tsconfig-opt.
tsconfig-opt. This option can be run without running webpack.
[string] [choices: "", "create-react-app", "node18", "node20", "react-native", "recommended", "strictest"]
--tsconfig-opt Regenerate or merge a tsconfig [string] [choices: "merge", "regen"] [default: "regen"]
-x, --extend Extend, or override, the default configs with your own relative path webpack configs using webpack merge.[array]
Expand Down
30 changes: 20 additions & 10 deletions bin/cli.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ const { setupDotenvFilesForEnv } = require('../src/dotenv');
const {
env: nodeEnv,
extend: extendedConfigs,
lang: language,
loader,
stats: statsFile,
tsconfig: baseTsConfig,
'tsconfig-opt': tsConfigOptions
Expand All @@ -31,10 +31,11 @@ const {
default: 'production'
})
.option('l', {
alias: 'lang',
describe: 'Codebase language, JS or TS',
alias: 'loader',
describe:
'Preprocess loader, use the classic JS (babel-loader), TS (ts-loader), or "none" to use webpack defaults, or a different loader.',
type: 'string',
choices: ['js', 'ts'],
choices: ['none', 'js', 'ts'],
default: 'js'
})
.option('s', {
Expand All @@ -46,15 +47,16 @@ const {
})
.option('tsconfig', {
describe:
'Generate a base tsconfig from NPM @tsconfig/[base]. An existing tsconfig.json will override this option, see tsconfig-opt.',
'Generate a base tsconfig from NPM @tsconfig/[base]. An existing tsconfig.json will override this option, see tsconfig-opt. This option can be run without running webpack.',
type: 'string',
choices: ['', 'create-react-app', 'node18', 'node20', 'react-native', 'recommended', 'strictest']
})
.option('tsconfig-opt', {
describe: 'Regenerate or merge a tsconfig',
type: 'string',
choices: ['merge', 'regen'],
default: 'regen'
implies: 'tsconfig',
coerce: args => (!args && 'regen') || args
})
.option('x', {
alias: 'extend',
Expand All @@ -68,9 +70,9 @@ const {
/**
* Set global OPTIONS
*
* @type {{statsFile: string, dotenv: object, isRegenTsConfig: boolean, baseTsConfig: string,
* extendedConfigs: Array<string>, isMergeTsConfig: boolean, language: string, statsPath: string,
* nodeEnv: string}}
* @type {{statsFile: string, dotenv: object, isRegenTsConfig: boolean, isCreateTsConfig: boolean,
* loader: string, isCreateTsConfigOnly: boolean, baseTsConfig: string, extendedConfigs: Array<string>,
* isMergeTsConfig: boolean, statsPath: string, nodeEnv: string}}
* @private
*/
OPTIONS._set = {
Expand All @@ -88,13 +90,21 @@ OPTIONS._set = {

return setupDotenvFilesForEnv({ env: process.env.NODE_ENV, relativePath: this.contextPath, isMessaging: true });
},
isCreateTsConfig: function () {
const isBaseTsConfig = typeof baseTsConfig === 'string';
return (loader === 'ts' && isBaseTsConfig) || isBaseTsConfig;
},
isCreateTsConfigOnly: function () {
const isBaseTsConfig = typeof baseTsConfig === 'string';
return (loader !== 'ts' && isBaseTsConfig) || false;
},
isMergeTsConfig: function () {
return tsConfigOptions === 'merge';
},
isRegenTsConfig: function () {
return tsConfigOptions === 'regen';
},
language,
loader,
statsFile: function () {
return (statsFile && path.basename(statsFile)) || undefined;
},
Expand Down
1 change: 1 addition & 0 deletions cspell.config.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
"fnames",
"nocolor",
"oneline",
"preprocess",
"regen",
"stringifier",
"systemvars"
Expand Down
51 changes: 47 additions & 4 deletions src/README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -237,10 +237,24 @@ Start `weldable`

<a name="module_Init..weldable"></a>

### Init~weldable() ⇒ <code>Promise.&lt;void&gt;</code>
### Init~weldable(options) ⇒ <code>Promise.&lt;void&gt;</code>
Organize package functionality.

**Kind**: inner method of [<code>Init</code>](#module_Init)
<table>
<thead>
<tr>
<th>Param</th><th>Type</th>
</tr>
</thead>
<tbody>
<tr>
<td>options</td><td><code>object</code></td>
</tr><tr>
<td>options.isCreateTsConfigOnly</td><td><code>boolean</code></td>
</tr> </tbody>
</table>

<a name="module_Logger"></a>

## Logger
Expand All @@ -266,7 +280,7 @@ Convenience wrapper for preset console messaging and colors.
## Typescript
<a name="module_Typescript..createTsConfig"></a>

### Typescript~createTsConfig(dotenv, options) ⇒ <code>undefined</code> \| <code>Object</code>
### Typescript~createTsConfig(dotenv, options, settings) ⇒ <code>undefined</code> \| <code>Object</code>
Create, or merge, a tsconfig file.

**Kind**: inner method of [<code>Typescript</code>](#module_Typescript)
Expand All @@ -288,11 +302,15 @@ Create, or merge, a tsconfig file.
</tr><tr>
<td>options.contextPath</td><td><code>string</code></td>
</tr><tr>
<td>options.isCreateTsConfig</td><td><code>boolean</code></td>
</tr><tr>
<td>options.isMergeTsConfig</td><td><code>boolean</code></td>
</tr><tr>
<td>options.isRegenTsConfig</td><td><code>boolean</code></td>
</tr><tr>
<td>options.language</td><td><code>string</code></td>
<td>settings</td><td><code>object</code></td>
</tr><tr>
<td>settings.configFilename</td><td><code>string</code></td>
</tr> </tbody>
</table>

Expand Down Expand Up @@ -411,10 +429,35 @@ Start webpack development or production.
## webpackConfigs

* [webpackConfigs](#module_webpackConfigs)
* [~preprocessLoader(dotenv, options)](#module_webpackConfigs..preprocessLoader) ⇒ <code>Object</code>
* [~common(dotenv, options)](#module_webpackConfigs..common) ⇒ <code>Object</code>
* [~development(dotenv)](#module_webpackConfigs..development) ⇒ <code>Object</code>
* [~production(dotenv)](#module_webpackConfigs..production) ⇒ <code>Object</code>

<a name="module_webpackConfigs..preprocessLoader"></a>

### webpackConfigs~preprocessLoader(dotenv, options) ⇒ <code>Object</code>
Assumption based preprocess loader

**Kind**: inner method of [<code>webpackConfigs</code>](#module_webpackConfigs)
<table>
<thead>
<tr>
<th>Param</th><th>Type</th>
</tr>
</thead>
<tbody>
<tr>
<td>dotenv</td><td><code>object</code></td>
</tr><tr>
<td>dotenv._BUILD_SRC_DIR</td><td><code>string</code></td>
</tr><tr>
<td>options</td><td><code>object</code></td>
</tr><tr>
<td>options.loader</td><td><code>string</code></td>
</tr> </tbody>
</table>

<a name="module_webpackConfigs..common"></a>

### webpackConfigs~common(dotenv, options) ⇒ <code>Object</code>
Expand Down Expand Up @@ -445,7 +488,7 @@ Common webpack settings between environments.
</tr><tr>
<td>options</td><td><code>object</code></td>
</tr><tr>
<td>options.language</td><td><code>string</code></td>
<td>options.loader</td><td><code>string</code></td>
</tr> </tbody>
</table>

Expand Down
Loading

0 comments on commit 0f1d643

Please sign in to comment.