Skip to content
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.

Commit 20f2fd0

Browse files
manuelgeekmanuelgeek
committedOct 8, 2024·
fixed storybook builds
1 parent 8027760 commit 20f2fd0

25 files changed

+3785
-5668
lines changed
 

‎apps/frontend-next/project.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
"outputs": ["{options.outputPath}"],
1111
"defaultConfiguration": "production",
1212
"options": {
13-
"outputPath": "dist/frontend-next"
13+
"outputPath": "dist/apps/frontend-next"
1414
}
1515
},
1616
"test": {

‎apps/frontend-vue/eslint.config.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,9 @@ module.exports = [
1919
vue: eslintPluginVue,
2020
},
2121
},
22-
{ ignores: ['!**/*'] },
22+
{
23+
ignores: ['!**/*', '**/dist/*', '**/node_modules', '**/vite.config.ts'],
24+
},
2325
{
2426
languageOptions: {
2527
parser: vueEslintParser,

‎apps/frontend-vue/project.json

+11-24
Original file line numberDiff line numberDiff line change
@@ -6,34 +6,21 @@
66
"tags": [],
77
"targets": {
88
"build": {
9-
"executor": "@nx/vite:build",
10-
"outputs": ["{options.outputPath}"],
9+
"executor": "nx:run-commands",
10+
"outputs": ["{workspaceRoot}/dist/apps/frontend-vue/"],
1111
"defaultConfiguration": "production",
1212
"options": {
13-
"outputPath": "dist/apps/frontend-vue",
14-
"baseHref": "/",
15-
"configFile": "apps/frontend-vue/vite.config.ts",
16-
"postcssConfig": "apps/frontend-vue/postcss.config.js"
17-
}
18-
},
19-
"serve": {
20-
"executor": "@nx/vite:serve",
21-
"options": {
22-
"outputPath": "dist/apps/frontend-vue",
23-
"baseHref": "/",
24-
"configFile": "apps/frontend-vue/vite.config.ts",
25-
"postcssConfig": "apps/frontend-vue/postcss.config.js"
13+
"commands": [
14+
"mkdir -p dist/apps/frontend-vue",
15+
"cp -r apps/frontend-vue/dist/** dist/apps/frontend-vue/"
16+
],
17+
"parallel": false
2618
},
27-
"configurations": {
28-
"production": {
29-
"fileReplacements": [
30-
{
31-
"replace": "apps/frontend-vue/src/environments/environment.ts",
32-
"with": "apps/frontend-vue/src/environments/environment.prod.ts"
33-
}
34-
]
19+
"dependsOn": [
20+
{
21+
"target": "vite:build"
3522
}
36-
}
23+
]
3724
},
3825
"lint": {
3926
"executor": "@nrwl/linter:eslint",

‎apps/frontend-vue/src/components/Register.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script setup lang="ts">
2-
import { FormInput, CustomButton } from '@nx-vite-vue/ui-kit-vue'
2+
import { FormInput, CustomButton } from '@nx-vite-infra/ui-kit-vue'
33
</script>
44
<template>
55
<!-- component -->

‎apps/frontend-vue/vite.config.ts

-7
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,4 @@ import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin'
44

55
export default defineConfig({
66
plugins: [vue(), nxViteTsPaths()],
7-
// build: {
8-
// rollupOptions: {
9-
// external: [
10-
// '@nx-vite-vue/ui-kit-vue',
11-
// ],
12-
// },
13-
// },
147
})

‎libs/ui-kit-vue/.storybook/main.js

-36
This file was deleted.

‎libs/ui-kit-vue/.storybook/main.ts

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import type { StorybookConfig } from '@storybook/vue3-vite'
2+
3+
import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin'
4+
import { mergeConfig } from 'vite'
5+
import vue from '@vitejs/plugin-vue'
6+
7+
const config: StorybookConfig = {
8+
stories: ['../src/**/*.@(mdx|stories.@(js|jsx|ts|tsx))'],
9+
addons: [
10+
'@storybook/addon-essentials',
11+
'@storybook/addon-interactions',
12+
'@storybook/addon-themes',
13+
],
14+
framework: {
15+
name: '@storybook/vue3-vite',
16+
options: {},
17+
},
18+
19+
viteFinal: async (config) =>
20+
mergeConfig(config, {
21+
plugins: [vue(), nxViteTsPaths()],
22+
}),
23+
}
24+
25+
export default config
26+
27+
// To customize your Vite configuration you can use the viteFinal field.
28+
// Check https://storybook.js.org/docs/react/builders/vite#configuration
29+
// and https://nx.dev/recipes/storybook/custom-builder-configs

‎libs/ui-kit-vue/.storybook/preview.js

-11
This file was deleted.

‎libs/ui-kit-vue/.storybook/preview.ts

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import '../../../.tailwind/tailwind.base.css'
2+
3+
import { withThemeByDataAttribute } from '@storybook/addon-themes'
4+
5+
export const parameters = {
6+
actions: { argTypesRegex: '^on[A-Z].*' },
7+
controls: {
8+
matchers: {
9+
color: /(background|color)$/i,
10+
date: /Date$/,
11+
},
12+
},
13+
}
14+
15+
export const decorators = [
16+
withThemeByDataAttribute({
17+
themes: {
18+
light: 'light',
19+
dark: 'dark',
20+
},
21+
defaultTheme: 'light',
22+
attributeName: 'data-mode',
23+
}),
24+
]

‎libs/ui-kit-vue/README.md

+8
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,14 @@
22

33
This library was generated with [Nx](https://nx.dev).
44

5+
## Running storybook
6+
7+
Run `nx storybook ui-kit-vue`
8+
9+
## Building storybook
10+
11+
Run `nx build ui-kit-vue`
12+
513
## Running unit tests
614

715
Run `nx test ui-kit-vue` to execute the unit tests via [Jest](https://jestjs.io).

‎libs/ui-kit-vue/eslint.config.js

+10-1
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,15 @@ module.exports = [
1919
vue: eslintPluginVue,
2020
},
2121
},
22-
{ ignores: ['!**/*'] },
22+
{
23+
ignores: [
24+
'!**/*',
25+
'**/*.config.js',
26+
'**/.storybook/*',
27+
'**/storybook-static/*',
28+
'**/node_modules',
29+
],
30+
},
2331
{
2432
languageOptions: {
2533
parser: vueEslintParser,
@@ -59,6 +67,7 @@ module.exports = [
5967
'import/extensions': 'off',
6068
'@nrwl/nx/enforce-module-boundaries': 'off',
6169
'import/no-unresolved': 'off',
70+
'vue/require-default-prop': 'off',
6271
},
6372
},
6473
{

‎libs/ui-kit-vue/package-lock.json

+14
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎libs/ui-kit-vue/package.json

-6
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,6 @@
22
"name": "ui-kit-vue",
33
"version": "1.0.0",
44
"description": "This library was generated with [Nx](https://nx.dev).",
5-
"main": "index.js",
6-
"scripts": {
7-
"test": "echo \"Error: no test specified\" && exit 1",
8-
"storybook": "start-storybook -p 6006",
9-
"build-storybook": "build-storybook"
10-
},
115
"keywords": [],
126
"author": "",
137
"license": "ISC",

‎libs/ui-kit-vue/.tailwind/postcss.config.js ‎libs/ui-kit-vue/postcss.config.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
const { join } = require('path')
2-
const baseConfig = require('../../../.tailwind/postcss.config')
2+
const baseConfig = require('../../.tailwind/postcss.config')
33

44
module.exports = {
55
...baseConfig,

‎libs/ui-kit-vue/project.json

+6-20
Original file line numberDiff line numberDiff line change
@@ -5,35 +5,20 @@
55
"projectType": "library",
66
"tags": [],
77
"targets": {
8-
"storybook": {
9-
"executor": "@nrwl/workspace:run-commands",
10-
"options": {
11-
"commands": ["cd libs/ui-kit-vue && npm run storybook"]
12-
}
13-
},
14-
"build-storybook": {
15-
"executor": "@nrwl/workspace:run-commands",
16-
"options": {
17-
"cwd": "libs/ui-kit-vue",
18-
"commands": ["npm run build-storybook"]
19-
}
20-
},
218
"build": {
22-
"executor": "@nrwl/workspace:run-commands",
23-
"outputs": ["{workspaceRoot}/dist/libs/storybook/"],
9+
"executor": "nx:run-commands",
10+
"outputs": ["{workspaceRoot}/dist/libs/ui-kit-vue/"],
11+
"defaultConfiguration": "production",
2412
"options": {
2513
"commands": [
26-
"cp -r libs/ui-kit-vue/storybook-static/** dist/libs/storybook/"
14+
"mkdir -p dist/libs/ui-kit-vue",
15+
"cp -r libs/ui-kit-vue/storybook-static/** dist/libs/ui-kit-vue/"
2716
],
2817
"parallel": false
2918
},
3019
"dependsOn": [
3120
{
3221
"target": "build-storybook"
33-
},
34-
{
35-
"target": "build",
36-
"dependencies": true
3722
}
3823
]
3924
},
@@ -43,6 +28,7 @@
4328
"options": {
4429
"lintFilePatterns": [
4530
"libs/ui-kit-vue/**/*.ts",
31+
"libs/ui-kit-vue/**/*.js",
4632
"libs/ui-kit-vue/**/*.vue"
4733
]
4834
}

‎libs/ui-kit-vue/src/lib/components/CustomButton/CustomButton.stories.ts

+1
Original file line numberDiff line numberDiff line change
@@ -64,5 +64,6 @@ interface ButtonProps {
6464
type?: string
6565
color?: string
6666
disabled?: boolean
67+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
6768
slotTemplate?: any
6869
}

‎libs/ui-kit-vue/src/stories/Header/Header.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@
2626
<h1>Acme</h1>
2727
</div>
2828
<div>
29-
<span v-if="user" class="welcome"
29+
<span v-if="user" class="welcome text-secondary"
3030
>Welcome, <b>{{ user.name }}</b
3131
>!</span
3232
>

‎libs/ui-kit-vue/.tailwind/tailwind.config.js ‎libs/ui-kit-vue/tailwind.config.js

+4-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
11
const { join } = require('path')
2-
const baseConfig = require('../../../.tailwind/tailwind.config')
2+
const baseConfig = require('../../.tailwind/tailwind.config')
33

44
module.exports = {
55
presets: [baseConfig],
66
content: [
7-
join(__dirname, '../src/**/!(*.stories|*.spec).{ts,tsx,html,vue,js}'),
7+
join(__dirname, './src/**/!(*.stories|*.spec).{ts,tsx,html,vue,js}'),
88
],
9+
// Toggle dark-mode based on .dark class or data-mode="dark"
10+
darkMode: ['class', '[data-mode="dark"]'],
911
theme: {
1012
extend: {
1113
boxShadow: {

‎libs/ui-kit-vue/tsconfig.json

+3
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,9 @@
88
},
99
{
1010
"path": "./tsconfig.spec.json"
11+
},
12+
{
13+
"path": "./tsconfig.storybook.json"
1114
}
1215
],
1316
"compilerOptions": {

‎libs/ui-kit-vue/tsconfig.lib.json

+6-1
Original file line numberDiff line numberDiff line change
@@ -6,5 +6,10 @@
66
"types": []
77
},
88
"include": ["src/**/*.ts", "src/**/*.js", "src/**/*.vue"],
9-
"exclude": ["jest.config.ts", "src/**/*.spec.ts"]
9+
"exclude": [
10+
"jest.config.ts",
11+
"src/**/*.spec.ts",
12+
"**/*.stories.ts",
13+
"**/*.stories.js"
14+
]
1015
}

‎libs/ui-kit-vue/tsconfig.storybook.json

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
{
2+
"extends": "./tsconfig.json",
3+
"compilerOptions": {
4+
"emitDecoratorMetadata": true
5+
},
6+
"exclude": ["src/**/*.spec.ts", "src/**/*.test.ts"],
7+
"include": [
8+
"src/**/*.stories.ts",
9+
"src/**/*.stories.js",
10+
"src/**/*.stories.jsx",
11+
"src/**/*.stories.tsx",
12+
"src/**/*.stories.mdx",
13+
".storybook/*.js",
14+
".storybook/*.ts"
15+
]
16+
}

‎nx.json

+11-1
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,8 @@
5151
"nexus-generate",
5252
"lint",
5353
"test",
54-
"generate"
54+
"generate",
55+
"build-storybook"
5556
],
5657
"parallel": 1
5758
}
@@ -92,6 +93,15 @@
9293
"serveStaticTargetName": "serve-static",
9394
"typecheckTargetName": "typecheck"
9495
}
96+
},
97+
{
98+
"plugin": "@nx/storybook/plugin",
99+
"options": {
100+
"serveStorybookTargetName": "storybook",
101+
"buildStorybookTargetName": "build-storybook",
102+
"testStorybookTargetName": "test-storybook",
103+
"staticStorybookTargetName": "static-storybook"
104+
}
95105
}
96106
],
97107
"cacheDirectory": "./.nx-cache"

‎package.json

+26-17
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"version": "0.0.0",
44
"license": "MIT",
55
"scripts": {
6-
"frontend-vue:serve": "nx run frontend-vue:serve",
6+
"frontend-vue:dev": "nx run frontend-vue:preview",
77
"frontend-vue:build": "nx run frontend-vue:build",
88
"lint": "nx run-many --target=lint --all --parallel",
99
"test": "nx run-many --target=test --all --parallel",
@@ -27,17 +27,19 @@
2727
"@nx/js": "19.7.2",
2828
"@nx/next": "19.7.2",
2929
"@nx/node": "19.7.2",
30+
"@nx/storybook": "19.7.2",
3031
"@nx/vite": "19.7.2",
32+
"@nx/vue": "19.7.2",
3133
"@nx/web": "19.7.2",
32-
"@storybook/addon-actions": "^6.5.16",
33-
"@storybook/addon-essentials": "^6.5.16",
34-
"@storybook/addon-interactions": "^6.5.16",
35-
"@storybook/addon-links": "^6.5.16",
36-
"@storybook/addon-postcss": "^2.0.0",
37-
"@storybook/builder-webpack4": "^6.5.16",
38-
"@storybook/manager-webpack4": "^6.5.16",
39-
"@storybook/testing-library": "^0.0.13",
40-
"@storybook/vue3": "^6.5.16",
34+
"@storybook/addon-essentials": "^8.2.8",
35+
"@storybook/addon-interactions": "^8.2.8",
36+
"@storybook/addon-themes": "^8.3.5",
37+
"@storybook/core-server": "^8.2.8",
38+
"@storybook/jest": "^0.2.3",
39+
"@storybook/test-runner": "^0.13.0",
40+
"@storybook/testing-library": "^0.2.2",
41+
"@storybook/vue3": "^8.2.8",
42+
"@storybook/vue3-vite": "^8.2.8",
4143
"@swc-node/register": "~1.9.1",
4244
"@swc/core": "~1.5.7",
4345
"@swc/helpers": "~0.5.11",
@@ -49,8 +51,11 @@
4951
"@typescript-eslint/eslint-plugin": "^8.5.0",
5052
"@typescript-eslint/parser": "7.18.0",
5153
"@vitejs/plugin-vue": "^5.1.3",
52-
"@vitest/ui": "^0.9.3",
53-
"@vue/eslint-config-typescript": "^11.0.2",
54+
"@vitest/coverage-v8": "^1.0.4",
55+
"@vitest/ui": "^1.3.1",
56+
"@vue/eslint-config-prettier": "7.1.0",
57+
"@vue/eslint-config-typescript": "^11.0.3",
58+
"@vue/test-utils": "^2.4.1",
5459
"autoprefixer": "^10.4.13",
5560
"babel-jest": "^29.7.0",
5661
"babel-loader": "^8.3.0",
@@ -71,23 +76,26 @@
7176
"jest": "29.7.0",
7277
"jest-environment-jsdom": "29.7.0",
7378
"jest-environment-node": "^29.7.0",
79+
"jsdom": "~22.1.0",
7480
"lint-staged": "^13.1.1",
7581
"nx": "19.7.2",
7682
"nx-cloud": "19.1.0",
7783
"postcss": "8.4.38",
7884
"prettier": "^2.6.2",
7985
"rxjs": "^7.8.0",
86+
"storybook": "^8.2.8",
8087
"tailwindcss": "3.4.3",
8188
"ts-jest": "29.1.5",
8289
"ts-node": "10.9.1",
8390
"typescript": "~5.5.2",
84-
"vite": "^3.1.8",
91+
"vite": "^5.0.0",
8592
"vite-plugin-eslint": "^1.6.0",
86-
"vitest": "^0.24.3",
93+
"vitest": "^1.3.1",
8794
"vitest-preview": "latest",
88-
"vue": "^3.2.47",
95+
"vue": "^3.3.4",
8996
"vue-eslint-parser": "^9.4.3",
90-
"vue-loader": "^16.8.3"
97+
"vue-loader": "^16.8.3",
98+
"vue-tsc": "^2.0.0"
9199
},
92100
"overrides": {
93101
"vite": "^3.1.8"
@@ -103,6 +111,7 @@
103111
"prisma": "^5.19.1",
104112
"react": "18.3.1",
105113
"react-dom": "18.3.1",
106-
"tslib": "^2.3.0"
114+
"tslib": "^2.3.0",
115+
"vue-router": "^4.2.4"
107116
}
108117
}

‎vitest.workspace.ts

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export default ['**/*/vite.config.ts', '**/*/vitest.config.ts']

‎yarn.lock

+3,608-5,537
Large diffs are not rendered by default.

0 commit comments

Comments
 (0)
Please sign in to comment.