phase2/outline

[Bug]: CSS watch scripts failing in dev mode

himerus opened this issue · 1 comments

himerus commented

Describe the bug
CSS IS NOT being auto reloaded/watched properly in dev mode.

To Reproduce
Steps to reproduce the behavior:

  • Make a change CSS or TS file related
  • Observe there is no change in Storybook
  • Stop the build.
  • Run yarn start

Expected behavior
CSS IS being auto reloaded/watched properly in dev mode.

Additional context
How to fix this:

In https://github.com/phase2/outline/blob/next/packages/outline-templates/default/scripts/styles.mjs#L180C1-L199, these lines ARE already uncommented, so this is appropriate.

in https://github.com/phase2/outline/blob/next/packages/outline-templates/default/package.json, we need to make it look more like this as seen here (for those with access):

image

Note the following changes.

"scripts": {
    "start": "yarn watch",
    "watch": "npm-run-all -p watch:*",
    "watch:storybook": "yarn storybook:dev",
    "watch:css": "node scripts/styles.mjs --watch"
  },
himerus commented

Fix found here (with access)

in styles.mjs:

image