nx-plus

nx-plus copied to clipboard

Description

I would to use storybook with nx-plus and vue

Motivation

Nx supports storybook for angular and react

Suggested Implementation

We can take inspiration from nx and the way they implemented the schematics and builder

@BuckyMaler @ZachJW34 I would like to add the ability. Is that ok?

@mehrad-rafigh Go for it! Reach out if you have any questions.

@mehrad-rafigh any update on this? Need any help in developing the feature?

@LuckeeDev I have not found the time to develop this. You can grab this issue and start programming :)

@mehrad-rafigh yes, I can take a look at it!

do you have a repo that you have successfully configure storybook for a vue library in nx that can be used as a template for future development?

I am currently working on a PoC to migrate to Nx and possibly convince of its benefits but this is a show stopper, @LuckeeDev any help needed, are you currently working on this?

@danielquintero sadly, I've not had the time to work on this :(

Is there an estimate if and when this feature will be available? I would like to do something for it myself, but my skills are not enough.

The solution is pretty easy (for nuxt), but it took me several hours to get there.

1. Install nuxt/Storybook as mentioned here: https://storybook.nuxtjs.org/getting-started/installation/
2. Add the following to your nuxt-targets in workspace.json|angular.json|project.json (replace the value of cwd with the path of your app):

    "storybook": {
      "executor": "@nrwl/workspace:run-commands",
      "options": {
        "cwd": "apps/cockpit-app",
        "command": "npx nuxt storybook --ci",
        "parallel": false
      }
    },
    "build-storybook": {
      "executor": "@nrwl/workspace:run-commands",
      "options": {
        "cwd": "apps/cockpit-app",
        "command": "npx nuxt storybook build",
        "parallel": false
      }
    }

3. Add "build-storybook" to tasksRunnerOptions.default.options.cacheableOperations in nx.json
4. If you want to have your storybook-builds in dist you can achieve that with -o. In my case I replaced the command of build-storybook with npx nuxt storybook build -o ../../dist/apps/cockpit-app-storybook

Please do it someone, who has the time for it, really cool and important thing