Playroom snippets aren't built starting at v1.7.0
orther opened this issue · comments
Describe the bug
No snippets are loaded in Playroom.
I believe this is due to snippet files not being built in the build step after PR #219 (this line specifically: c7b6cb7#diff-bc07f02d36ef2d7ade1a2f1ee1935aa6R13)
To Reproduce
In a project updated to ds-cli
version >=1.7.0 with at least one component snippet:
- Clean dist dirs:
yarn clean --no-modules
- Build components:
yarn build
- Run playroom:
yarn playroom
- Notice that there aren't any snippets available
Expected behavior
Snippets are loaded and available in Playroom.
To get snippets working:
- Manually edit the
node_modules/@design-systems/build/dist/command.js
file to not ignore the snippet files:// ... export const defaults = { watch: false, inputDirectory: 'src', outputDirectory: 'dist', cssMain: 'main.css', ignore: [ '**/*.+(md|mdx)', '**/__tests__/**', '**/__snapshots__/**', // '**/*.+(stories|test|snippet).*' '**/*.+(stories|test).*' // <~~ I remove `|snippet` ] }; // ...
- Build components:
yarn build
- Run playroom:
yarn playroom
- Snippets are now available
Screenshots
For reference this is what the Playroom UI looks like with and withOUT snippets.
Playroom withOUT snippets | Playroom WITH snippets |
---|---|
Desktop (please complete the following information):
- OS: macOS 10.15.4
- Browser Chrome
- Version 1.7.0
Additional context
For reference here is the ColorSwatch.snippet.tsx
in my ColorSwatch
component that I'm testing with:
// File: ./components/ColorSwatch/src/ColorSwatch.snippet.tsx
import React from 'react';
import { ColorSwatch } from './ColorSwatch';
export default {
ColorSwatch: <ColorSwatch name="Dark Blue" colorKey="general.darkBlue" />,
};
1.7.4 should fix this. sorry for the regression
1.7.4 should fix this. sorry for the regression
No problem. Thanks for pushing the fix!
I have confirmed it works and solves the problem reported in this issue (so I'm closing)