v1

When migrating from a v1 pre-release (pre-release 15):

package.json

• Uninstall the previous @nycopportunity/patterns-framework and install the new CLI package @nycopportunity/pttrn

• Install @nycopportunity/pttrn-scripts if using any of the utility ES modules previously in the directory @nycopportunity/patterns-framework/src/utilities.

• Install @nycopportunity/pttrn-docs if using any of the prewritten documentation, such as the installation guide or Tailwindcss guide in the directory @nycopportunity/patterns-framework/docs.

• Install Rollup plugins @rollup/plugin-buble or @rollup/plugin-babel if using them in your ./config/rollup.js configuration for IE11 support.

Tailwindcss v2

Tailwindcss has a few changes but notably requires PostCSS 8. This may be fine in some cases, however, at the time of release another helpful PostCSS plugin cssnano does not yet support PostCSS 8.

You may install Tailwindcss v1 as a peer dependency in your project to maintain compatibility with PostCSS 7 and other used plugins...

... or...

... update and install other peer dependencies in your project, particularly PostCSS 8 (alternatively, you may be able to just run npm update --depth=1 if the dependency is already installed by another package) and can be updated but including the latest version as a dependency will ensure it's installed.

cssnano will still not be fully supported this way so you will need to stop using it (comment it out) until it's supported or find an alternative.

Configuration

• Tailwindcss. Update Tailwindcss configuration name from ./config/tailwind.js to ./config/tailwindcss.js and any other config dependency references to it (such as in the ./config/slm.js and ./config/postcss.js configurations).

• Rollup. Rollup Plugin Node Resolve has a different implementation in this latest update;

const nodeResolve = require('@rollup/plugin-node-resolve');

...

const plugins = [
  nodeResolve.nodeResolve({
    browser: true,
    moduleDirectories: [
      'node_modules'
    ]
  }),

...

• Svgs. The new ./config/svgs.js configuration file adds a prefix and changes the location of the default sprite distribution by default. To retain compatibility with the old configuration this configuration can be placed in your project if you do not use an svgs configuration.

module.exports = {
  prefix: '', // omit prefix
  svgo: {
    convertPathData: false,
  },
  svgstore: {
    file: 'svg/icons.svg' // sprite destination
  }
};

Scripts

• Once the new @nycopportunity/pttrn-scripts package is installed, replace import statement paths in JavaScript files with from @nycopportunity/patterns-framework/src/utilities/ to @nycopportunity/pttrn-scripts/src/

Styles

• Once the new @nycopportunity/pttrn-scripts package is installed, replace @forward or @use import statement paths in Sass files with from @nycopportunity/patterns-framework/src/utilities/ to @nycopportunity/pttrn-scripts/src/

Other migration issues may be submitted and added to this list.