CLI updates

README.md

@@ -229,25 +229,40 @@ Enhance Styles includes a CSS reset by default. To opt out of this reset being i
 
 ## Standalone usage
 
-To use Enhance Styles in other applications or frameworks, clone the repository:
+To use Enhance Styles in other applications or frameworks, install Enhance Styles from npm:
 
 ```shell
-git clone https://github.com/enhance-dev/enhance-styles.git
+npm i -D @enhance/styles
 ```
 
-Enhance Styles can be customized to your liking. See [the customization instructions](#customize) for a reference to which aspects of Enhance Styles can be adjusted to your liking. After writing your preferred `config.json` options, write the generated styles to `dist/enhance.css`:
+The built in CLI, `enhance-styles`, takes two arguments: `--config=` and `--output=`. The `--config` argument is the path to your configuration file and the `--output` argument is the path where the .css file will be created. 
+
+If you do not specify config, the default configuration will be used.  
+You can use the default configuration or [create your own](#customize). We recommend a local project file like `./styleguide.json`.
+
+If you do not specify output, the CSS will be printed to stdout.
 
 ```shell
-npm run build
+npx enhance-styles --config=./styleguide.json --output=./public/enhance.css
+```
+
+Or add it as a script to your package.json:
+
+```json
+{
+  "scripts": {
+    "enhance-styles": "enhance-styles --config=./styleguide.json --output=./public/enhance.css"
+  }
+}
 ```
 
-Minify `dist/enhance.css` to `dist/enhance.min.css`:
+Then run:
 
 ```shell
-npm run dist
+npm run enhance-styles
 ```
 
-Copy `enhance.css` or `enhance.min.css` to your project and either reference it with the `<link>` element, or inline it in a `<style>` element in your document head.
+If you'd like, minification can be added as a part of your build process.
 
 ## Prior art
 

cli.mjs

@@ -1,10 +1,42 @@
 #!/usr/bin/env node
-import fs from 'fs'
-import path from 'path'
-import * as url from 'url'
-const __dirname = url.fileURLToPath(new URL('.', import.meta.url))
-const arg = process.argv[2]
-const configpath = arg || path.join(__dirname, './config.json')
+import { readFileSync, writeFileSync } from 'node:fs'
+import { join } from 'node:path'
+import { argv, cwd, stderr, stdout } from 'node:process'
+import { fileURLToPath } from 'node:url'
 import styles from './index.mjs'
-const config = fs.readFileSync(configpath, 'utf-8')
-process.stdout.write(styles(config))
+
+function getArg(key) {
+  const value = argv.find(a => a.startsWith(`--${key}=`))
+  if (!value) return null
+  return value.replace(`--${key}=`, '')
+}
+
+const here = fileURLToPath(new URL('.', import.meta.url))
+
+const configArg = getArg('config')
+const outputArg = getArg('output')
+const configPath = configArg
+  ? join(cwd(), configArg)
+  : join(here, './config.json')
+
+let configBlob
+try {
+  configBlob = readFileSync(configPath, 'utf-8')
+}
+catch (err) {
+  stderr.write(`Error reading config file: ${configPath}\n`)
+  process.exit(1)
+}
+
+if (outputArg) {
+  const outputPath = join(cwd(), outputArg)
+  try {
+    writeFileSync(outputPath, styles(configBlob))
+  }
+  catch (err) {
+    stderr.write(`Error writing to output file: ${outputPath}\n`)
+    process.exit(1)
+  }
+} else {
+  stdout.write(styles(configBlob))
+}