Skip to content

Slm Async and Configuration Enhancement, Serve Async, Cross Env
Compare
Choose a tag to compare
@devowhippit devowhippit released this 06 Mar 16:23
v0.2.0
e3c97d5

Previously the Slm script was updated to use the chokidar package in place of nodemon for compiling slm and md files that have changed. This release includes that and an update to the script to use async/await methods as well as replace (the opinionated) prettier with beautify-js and markdown-js (deprecated) with marked. The configuration for both packages is exposed in the config. Additionally, the method for including markdown files in slm templates has been updated.

Migration

slm Command

pttrn slm

Update config/slm.js (potentially slm files)

Use the updated config/slm.js for guidance on how to update dependency settings and include variables for slm files.

Slm files may have used variables included through a scripts/locals.js script that wasn't previously available for configuration. Any local variables included in that script have been removed and exposed to the config/slm.js script for more control. As a result, some variable paths may have changed in the process for existing slm files.

this.site.

References to this.site. should be replaced with this. (remove the site path). Example

this.site.versions.package

...becomes ...

this.versions.package

this.site.author

this.site.author

...becomes ...

this.package.author

NODE_ENV

- if this.env.NODE_ENV === 'production'

...becomes ...

- if this.process.env.NODE_ENV === 'production'

See the example here.

Update include methods

The include method for escaped code has changed for simplicity, taking advantage of including functions in slm's output method.

Include compiled and escaped slm templates in slm files;

= this.include('utilities/toggle/toggle');

... replaces the previous template tag method for including escaped HTML for component demo pages;

= 'code{{ utilities/toggle/toggle.slm }}'

Include md files in slm files

== this.include('utilities/toggle/toggle.md');

... replaces the previous template tag method for including md in slm files.

= 'md{{ utilities/toggle/toggle }}'

The double == is important, see slm docs for details.

Include slm in md files

include{{ utilities/toggle/toggle.slm }}

... replaces the previous template tag method for including slm in md files.

slm{{ utilities/toggle/toggle }}

Explore your options for exporting node methods and the Beautify-js and Marked packages the slm config!

serve Command

pttrn serve

The Serve function has been updated as well and works a bit more intuitively. No migration is needed but be sure the reload script is properly being called in your HTML files for automatic reloading;

/ The reload script. This should not be compile during production builds
/ @source https://www.npmjs.com/package/reload
- if this.process.env.NODE_ENV !== 'production'
  script src='/reload/reload.js'

NPM Scripts and cross-env

cross-env, the package for making node.js env variables work for Windows is now an optional dependency and must be included in a framework project separately.

Tokens Config

The key opts in the config/tokens.js has been changed to config for consistency.

const tokens = {
  config: {
    output: '"./src/config/_tokens.scss"',
    prefix: '"$tokens:"'
  },
  ...

... becomes...

const tokens = {
  config: {
    output: '"./src/config/_tokens.scss"',
    prefix: '"$tokens:"'
  },
  ...
Assets 2
Loading