Building a site

How to make a project with Visual Framework components.

Components: deprecating

Inevitably code will be replaced and improved, leaving components stale and or outdated.

So we should tell developers to not use them.

Here's what we need to make sure we do:

  1. Developers can avoid installing and outdated component;
  2. Developers can know to stop using a component; and
  3. Components aren't removed so existing sites continue to function.

How to deprecate an entire component

  1. In the component-name.config.yml file add:
    • status: deprecated
    • component-type: deprecated
    • hidden: true
  2. In the component-name.scss file wrap the sass with:
    • html:not(.vf-disable-deprecated) {
  3. Update README.md with:
    • why the component has been deprecated
    • what component(s) developers should instead use
    • Use this template
    <h2>This component has been <span style="color: rgb(228, 0, 70);">deprecated</span>. Please use the <a class="vf-link" href="#"new</a> component.</h2> in the README.md file.
    
  4. Publish on npm
  5. Remove the component from vf-core
  6. Deprecate on npm
    • npm deprecate @visual-framework/component "no longer supported use the @visual-framework/component instead"

Need to deprecate just one variant of a component?

  1. Add a note to the --variant.njk
    • Use this template
    <h2>This variant has been <span style="color: rgb(228, 0, 70);">deprecated</span>. Please use the <a class="vf-link" href="#"new</a> component.</h2> in the README.md file.
    
  2. Wrap the relevant Sass in html:not(.vf-disable-deprecated) {
  3. Hide the variant tab in .config.yml:
variants:
  - name: deprecated-variant
    hidden: true

See also: example vf-deprecated component

Also in this section

More from the Building a site section

Browser support

We focus support on major browsers in use by 95%+ of our audiences, and we ensure the site is navigable and usable by the remaining 5%.

Components are part of patterns

Think of components as lego blocks you can use to build the look and content of your sites. Think of patterns as assembled packages of behaviour.

Content guidelines

Unique to the web are certain types of content that support user interaction.

Find an issue on this page? Propose a change or discuss it.