up storybook
This commit is contained in:
parent
0e9a0aa21e
commit
179a8d9279
344 changed files with 57478 additions and 87 deletions
|
@ -1,45 +1,67 @@
|
|||
# MyApp
|
||||
# Storybook Setup
|
||||
|
||||
Démo de design system avec Angular
|
||||
faisant des composants web.
|
||||
## Issues Fixed
|
||||
|
||||
Storybook.
|
||||
1. Fixed the import statement in `.storybook/preview.ts` to use the correct path for `INITIAL_VIEWPORTS`:
|
||||
```typescript
|
||||
// Changed from
|
||||
import { INITIAL_VIEWPORTS } from '@storybook/addon-viewport/presets';
|
||||
|
||||
// To
|
||||
import { INITIAL_VIEWPORTS } from '@storybook/addon-viewport';
|
||||
```
|
||||
|
||||
### Usage
|
||||
2. Removed deprecated Storybook addons:
|
||||
- Removed `@storybook/addon-backgrounds` from `.storybook/main.ts` and `package.json`
|
||||
- Removed `@storybook/addon-controls` from `.storybook/main.ts` and `package.json`
|
||||
- Kept the backgrounds and controls configuration in `.storybook/preview.ts` as these are now part of the core Storybook functionality
|
||||
|
||||
### Build Script Features
|
||||
## Remaining Issues
|
||||
|
||||
To build the application and prepare files for implementation:
|
||||
1. **Node.js Version Compatibility**:
|
||||
- The Angular CLI requires Node.js v20.19+ or v22.12+
|
||||
- Current Node.js version is v18.19.1
|
||||
- To fix this issue, you need to upgrade your Node.js version
|
||||
|
||||
## How to Upgrade Node.js
|
||||
|
||||
You can upgrade Node.js using one of the following methods:
|
||||
|
||||
### Using NVM (Node Version Manager)
|
||||
|
||||
```bash
|
||||
./build.sh
|
||||
# Install NVM if you don't have it already
|
||||
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
|
||||
|
||||
# Install the required Node.js version
|
||||
nvm install 20.19
|
||||
|
||||
# Use the installed version
|
||||
nvm use 20.19
|
||||
```
|
||||
|
||||
- Builds the Angular application
|
||||
- Checks for Node.js version compatibility (requires v20.19+ or v22.12+)
|
||||
- Renames the output files to match the expected names in the implementation directory:
|
||||
- CSS file → `design-system.css`
|
||||
- JS files → `design-system.js` (combines main and polyfills)
|
||||
- Copies the renamed files to the `implementation/assets` directory
|
||||
### Using Package Manager
|
||||
|
||||
### Requirements
|
||||
#### For Ubuntu/Debian:
|
||||
|
||||
- Node.js v20.19+ or v22.12+
|
||||
- npm
|
||||
```bash
|
||||
# Add NodeSource repository
|
||||
curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
|
||||
|
||||
## Development
|
||||
# Install Node.js
|
||||
sudo apt-get install -y nodejs
|
||||
```
|
||||
|
||||
- Angular application with web components
|
||||
- Storybook for component development and testing
|
||||
#### For macOS (using Homebrew):
|
||||
|
||||
# notes
|
||||
```bash
|
||||
brew update
|
||||
brew install node@20
|
||||
```
|
||||
|
||||
- génération de web components
|
||||
- maj des imports scss https://sass-lang.com/documentation/breaking-changes/import/
|
||||
After upgrading Node.js, run the following commands to reinstall dependencies and start Storybook:
|
||||
|
||||
# implémentation
|
||||
|
||||
Pour implémenter les composants de l'application Angular:
|
||||
|
||||
- charger le service de chatbot
|
||||
- mettre un composant
|
||||
```bash
|
||||
npm install
|
||||
npm run storybook
|
||||
```
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue