wcs
Web Components SNCF - Main repo : https://gitlab.com/SNCF/wcs
파일 탐색기
- Default.md
- Default.md
- register.jsx
- main.js
- manager-head.html
- manager.js
- preview-head.html
- preview.js
- theme.js
- utils.ts
- checkbox-value-accessor.directive.ts
- counter-value-accessor.directive.ts
- grid-value-accessor.directive.ts
- input-value-accessor.directive.ts
- radio-group-value-accessor.directive.ts
- select-value-accessor.directive.ts
- switch-value-accessor.directive.ts
- textarea-value-accessor.directive.ts
- wcs-alert.service.ts
- proxies.ts
- wcs-angular.module.ts
- public-api.ts
- .npmrc
- karma.conf.js
- ng-package.json
- package.json
- README.md
- tsconfig.lib.json
- tsconfig.lib.prod.json
- tsconfig.spec.json
- tslint.json
- wcs-formly-options.pipe.ts
- formly-props-types.ts
- formly-wcs-boolean-field-wrapper.component.ts
- formly-wcs-field-checkbox.component.ts
- formly-wcs-field-counter.component.ts
- formly-wcs-field-input.component.ts
- formly-wcs-field-native-select.component.ts
- formly-wcs-field-radio.component.ts
- formly-wcs-field-select.component.ts
- formly-wcs-field-switch.component.ts
- formly-wcs-field-textarea.component.ts
- formly-wcs-field-wrapper.component.ts
- wcs-formly.module.ts
- public-api.ts
- .npmrc
- karma.conf.js
- ng-package.json
- package.json
- README.md
- tsconfig.lib.json
- tsconfig.lib.prod.json
- tsconfig.spec.json
- tslint.json
- .editorconfig
- .gitignore
- .npmrc
- angular.json
- package-lock.json
- package.json
- README.md
- tsconfig.json
- tslint.json
- design-token-json-to-css-wcs.drawio
- design-token-json-to-css-wcs.png
- sncf-groupe-primitive.json
- sncf-groupe-semantic.json
- sncf-holding-primitive.json
- sncf-holding-semantic.json
- sncf-reseau-primitive.json
- sncf-reseau-semantic.json
- sncf-voyageurs-primitive.json
- sncf-voyageurs-semantic.json
- sncf-groupe-primitive-output.json
- sncf-groupe-semantic-output.json
- sncf-holding-primitive-output.json
- sncf-holding-semantic-output.json
- sncf-reseau-primitive-output.json
- sncf-reseau-semantic-output.json
- sncf-voyageurs-primitive-output.json
- sncf-voyageurs-semantic-output.json
- index.mjs
- README.md
- sncf-groupe.css
- sncf-holding.css
- sncf-reseau.css
- sncf-voyageurs.css
- sncf-groupe-primitive.json
- sncf-groupe-semantic.json
- sncf-holding-primitive.json
- sncf-holding-semantic.json
- sncf-reseau-primitive.json
- sncf-reseau-semantic.json
- sncf-voyageurs-primitive.json
- sncf-voyageurs-semantic.json
- wcs-design-tokens-manifest.json
- index.mjs
- manifest.mjs
- README.md
- token-builder.mjs
- index.html
- base.scss
- icons.eot
- icons.svg
- icons.ttf
- icons.woff
- icons.woff2
- avenir-black.woff
- avenir-book.woff
- avenir-heavy.woff
- avenir-lighter.woff
- avenir-medium.woff
- avenir-roman.woff
- favicon.ico
- sncf-logo.png
- about-article.component.ts
- about-intro.component.ts
- about.component.ts
- breadcrumb.component.ts
- breadcrumb.service.ts
- aboutArticles.ts
- article-title.resolver.ts
- counter-example.component.ts
- counter-formly-default-value.component.ts
- counter-formly-passengers-example.component.ts
- formly-example.component.ts
- formly-input-examples.component.ts
- formly-styling-example.component.ts
- grid-example.component.ts
- grid-server-pagination-example.component.ts
- input-example.component.ts
- modal-example.component.ts
- radio-group-example.component.ts
- autocomplete-select-example.component.ts
- native-select-example.component.ts
- select-example.component.ts
- main-example.component.ts
- main-layout.component.ts
- app-module.ts
- app-routing-module.ts
- app.ts
- aria-current.directive.ts
- index.html
- main.ts
- styles.scss
- .editorconfig
- .gitignore
- .npmrc
- angular.json
- package-lock.json
- package.json
- README.md
- tsconfig.app.json
- tsconfig.json
- tsconfig.spec.json
- icons.eot
- icons.svg
- icons.ttf
- icons.woff
- icons.woff2
- avenir-black.woff
- avenir-book.woff
- avenir-heavy.woff
- avenir-lighter.woff
- avenir-medium.woff
- avenir-roman.woff
- favicon.ico
- sncf-logo.png
- app.config.ts
- app.routes.ts
- breadcrumb-page.component.ts
- controls-page-component.ts
- formly-page.ts
- grid-page.component.ts
- misc-page.component.ts
- modal-page.component.ts
- root.component.ts
- tooltip-page.component.ts
- index.html
- main.ts
- styles.scss
- .editorconfig
- .gitignore
- angular.json
- package-lock.json
- package.json
- README.md
- tsconfig.app.json
- tsconfig.json
- tsconfig.spec.json
- index.html
- index.html
- index.html
- icons.eot
- icons.svg
- icons.ttf
- icons.woff
- icons.woff2
- avenir-black.woff
- avenir-book.woff
- avenir-heavy.woff
- avenir-lighter.woff
- avenir-medium.woff
- avenir-roman.woff
- favicon.ico
- index.html
- logo192.png
- logo512.png
- manifest.json
- robots.txt
- sncf-logo.png
- alert-demo.tsx
- com-nav.tsx
- header.tsx
- input-demo.tsx
- nav.tsx
- textarea-demo.tsx
- AlertContext.tsx
- about.tsx
- example.tsx
- App.css
- App.test.tsx
- App.tsx
- index.css
- index.tsx
- react-app-env.d.ts
- reportWebVitals.ts
- setupTests.ts
- .gitignore
- config-overrides.js
- package-lock.json
- package.json
- README.md
- tsconfig.json
- package.json
- package.json
- README.md
- attachProps.ts
- case.ts
- dev.ts
- index.tsx
- createComponent.tsx
- createOverlayComponent.tsx
- index.ts
- interfaces.ts
- index.ts
- index.ts
- .gitignore
- package-lock.json
- package.json
- README.md
- rollup.config.mjs
- tsconfig.json
- custom-elements-output-storybook.ts
- README.md
- update-develop-from-master.js
- update-version.js
- icons.eot
- icons.svg
- icons.ttf
- icons.woff
- icons.woff2
- avenir-black.woff
- avenir-book.woff
- avenir-heavy.woff
- avenir-lighter.woff
- avenir-medium.woff
- avenir-roman.woff
- github-32px.png
- sncf-logo.png
- accordion.e2e.playwright.ts
- accordion.scss
- accordion.tsx
- readme.md
- accordion-content.scss
- accordion-content.tsx
- readme.md
- accordion-header.scss
- accordion-header.tsx
- readme.md
- accordion-panel.scss
- accordion-panel.tsx
- readme.md
- action-bar.scss
- action-bar.tsx
- readme.md
- alert-close-button.tsx
- alert-interface.ts
- alert-keyframes.scss
- alert.e2e.playwright.ts
- alert.scss
- alert.tsx
- readme.md
- alert-drawer-interface.ts
- alert-drawer-keyframes.scss
- alert-drawer.e2e.playwright.ts
- alert-drawer.scss
- alert-drawer.tsx
- readme.md
- app.scss
- app.tsx
- readme.md
- badge-interface.ts
- badge.scss
- badge.tsx
- readme.md
- breadcrumb-constants.ts
- breadcrumb.e2e.playwright.ts
- breadcrumb.scss
- breadcrumb.tsx
- readme.md
- breadcrumb-item.scss
- breadcrumb-item.tsx
- readme.md
- button-interface.ts
- button.e2e.playwright.ts
- button.scss
- button.tsx
- readme.md
- card-interface.ts
- card.scss
- card.tsx
- readme.md
- card-body.scss
- card-body.tsx
- readme.md
- card-content.scss
- card-content.tsx
- readme.md
- card-footer.scss
- card-footer.tsx
- readme.md
- card-header.scss
- card-header.tsx
- readme.md
- card-media.scss
- card-media.tsx
- readme.md
- checkbox-interface.ts
- checkbox.e2e.playwright.ts
- checkbox.scss
- checkbox.tsx
- readme.md
- chip-interface.ts
- chip.e2e.playwright.ts
- chip.scss
- chip.tsx
- readme.md
- com-nav-focus.scss
- com-nav-interface.ts
- com-nav-size.ts
- com-nav-utils.ts
- com-nav.e2e.playwright.ts
- com-nav.scss
- com-nav.tsx
- readme.md
- com-nav-category.scss
- com-nav-category.tsx
- readme.md
- com-nav-item.scss
- com-nav-item.tsx
- readme.md
- com-nav-submenu.scss
- com-nav-submenu.tsx
- readme.md
- counter-interface.ts
- counter.e2e.playwright.ts
- counter.scss
- counter.tsx
- readme.md
- divider.scss
- divider.tsx
- readme.md
- dropdown-interface.ts
- dropdown-keyboard-event.ts
- dropdown.e2e.playwright.ts
- dropdown.scss
- dropdown.tsx
- readme.md
- dropdown-divider.scss
- dropdown-divider.tsx
- readme.md
- dropdown-header.scss
- dropdown-header.tsx
- readme.md
- dropdown-item.scss
- dropdown-item.tsx
- readme.md
- editable-field-interface.tsx
- editable-field.e2e.playwright.ts
- editable-field.scss
- editable-field.tsx
- readme.md
- error.scss
- error.tsx
- readme.md
- field.scss
- field.tsx
- readme.md
- field-content.tsx
- readme.md
- field-label.tsx
- readme.md
- footer.scss
- footer.tsx
- readme.md
- form-field.e2e.playwright.ts
- form-field.scss
- form-field.tsx
- readme.md
- galactic.scss
- galactic.tsx
- readme.md
- galactic-menu.scss
- galactic-menu.tsx
- readme.md
- grid-interface.ts
- grid-keyboard-event.ts
- grid-radio.scss
- grid-radio.tsx
- grid.e2e.playwright.ts
- grid.scss
- grid.tsx
- readme.md
- grid-column.scss
- grid-column.tsx
- grid-sort-arrow.scss
- grid-sort-arrow.tsx
- readme.md
- grid-custom-cell.tsx
- readme.md
- grid-pagination-arrow.tsx
- grid-pagination.scss
- grid-pagination.tsx
- readme.md
- header.scss
- header.tsx
- readme.md
- hint.scss
- hint.tsx
- readme.md
- horizontal-step.tsx
- horizontal-stepper-interface.ts
- horizontal-stepper.scss
- horizontal-stepper.tsx
- readme.md
- icon.tsx
- readme.md
- input-interface.ts
- input.e2e.playwright.ts
- input.scss
- input.tsx
- readme.md
- label.e2e.playwright.ts
- label.scss
- label.tsx
- readme.md
- list-item.scss
- list-item.tsx
- readme.md
- list-item-properties.scss
- list-item-properties.tsx
- readme.md
- list-item-property.scss
- list-item-property.tsx
- readme.md
- mat-icon-google-stylesheets.scss
- mat-icon-interface.tsx
- mat-icon.scss
- mat-icon.tsx
- readme.md
- message-interface.ts
- message.scss
- message.tsx
- readme.md
- modal-interface.ts
- modal.e2e.playwright.ts
- modal.scss
- modal.tsx
- readme.md
- native-select-interface.ts
- native-select.scss
- native-select.tsx
- readme.md
- nav.scss
- nav.tsx
- readme.md
- nav-item.scss
- nav-item.tsx
- readme.md
- progress-bar.scss
- progress-bar.tsx
- readme.md
- progress-radial.scss
- progress-radial.tsx
- readme.md
- radio-interface.ts
- radio.scss
- radio.tsx
- readme.md
- radio-group-interface.ts
- radio-group.e2e.playwright.ts
- radio-group.scss
- radio-group.tsx
- readme.md
- readme.md
- select-arrow.tsx
- select-chips.tsx
- select-interface.ts
- select-keyboard-event.ts
- select.e2e.playwright.ts
- select.scss
- select.tsx
- readme.md
- select-option-interface.ts
- select-option.scss
- select-option.tsx
- skeleton-interface.ts
- skeleton.scss
- readme.md
- skeleton-circle.scss
- skeleton-circle.tsx
- readme.md
- skeleton-rectangle.scss
- skeleton-rectangle.tsx
- readme.md
- skeleton-text.scss
- skeleton-text.tsx
- readme.md
- spinner-interface.ts
- spinner.scss
- spinner.tsx
- readme.md
- switch-interface.ts
- switch.e2e.playwright.ts
- switch.scss
- switch.tsx
- readme.md
- tab.scss
- tab.tsx
- readme.md
- tabs-interface.ts
- tabs.e2e.playwright.ts
- tabs.scss
- tabs.tsx
- readme.md
- textarea-interface.ts
- textarea.e2e.playwright.ts
- textarea.scss
- textarea.tsx
- readme.md
- tooltip-interface.ts
- tooltip.scss
- tooltip.tsx
- toast-common.scss
- breakpoints.scss
- elevation.scss
- focus-outline.scss
- global.scss
- overlay.scss
- placeholder.scss
- reset.scss
- tooltip.scss
- material-icons.woff2
- test-expect.ts
- test.css
- test.ts
- accessibility.ts
- control-component-interface.ts
- helpers.ts
- keyboard-event.ts
- mutable-aria-attribute.ts
- overlay.ts
- components.d.ts
- index.ts
- shared-types.ts
- accessibility-contrast.png
- accessibility.svg
- Cover-Design-Tokens.webp
- cover.webp
- form-example1.png
- form-example2.png
- gitlab-logo.png
- npm-logo.png
- sncf-groupe.svg
- sncf-logo.png
- sncf-reseau.svg
- sncf-voyageurs.svg
- sncf.svg
- train.svg
- train_autumn.jpg
- train_spring.jpg
- train_summer.jpg
- train_winter.jpg
- wcs-logo-black.png
- wcs-logo-white.png
- x73500-web-small.png
- accordion-content.stories.ts
- accordion-header.stories.ts
- accordion-panel.stories.ts
- accordion.stories.ts
- action-bar.stories.ts
- tab-inside-documentation.md
- alert.stories.ts
- alert-drawer-documentation.md
- alert-drawer.stories.ts
- badge.stories.ts
- breadcrumb-item.stories.ts
- breadcrumb.stories.ts
- button.stories.ts
- card-body.stories.ts
- card-header.stories.ts
- card-media.stories.ts
- card.stories.ts
- form-in-card-documentation.md
- wcs-card-content.stories.ts
- wcs-card-footer.stories.ts
- checkbox.stories.ts
- chip.stories.ts
- com-nav-category.stories.ts
- com-nav-documentation.md
- com-nav-item.stories.ts
- com-nav-submenu.stories.ts
- com-nav.stories.ts
- counter.stories.ts
- divider.stories.ts
- dropdown-divider.stories.ts
- dropdown-header.stories.ts
- dropdown-item.stories.ts
- dropdown.stories.ts
- editable-field.stories.ts
- field-content.stories.ts
- field-label.stories.ts
- field.stories.ts
- footer-documentation.md
- footer.stories.ts
- error.stories.ts
- form-field.stories.ts
- hint.stories.ts
- label.stories.ts
- galactic-documentation.md
- galactic-menu.stories.ts
- galactic.stories.ts
- grid-column.stories.ts
- grid-custom-cell.stories.ts
- grid-pagination.stories.ts
- grid.stories.ts
- pagination-sample-data.ts
- header.stories.ts
- sncf.svg
- horizontal-stepper.stories.ts
- input.stories.ts
- list-item-properties.stories.ts
- list-item-property.stories.ts
- list-item.stories.ts
- mat-icon-documentation.md
- mat-icon.stories.ts
- message.stories.ts
- modal.stories.ts
- native-select.stories.ts
- nav-documentation.md
- nav-item.stories.ts
- nav.stories.ts
- progress-bar.stories.ts
- progress-radial.stories.ts
- radio-group.stories.ts
- radio.stories.ts
- select-option.stories.ts
- select-sample-data.ts
- select.stories.ts
- skeleton-circle.stories.ts
- skeleton-rectangle.stories.ts
- skeleton-text.stories.ts
- skeleton.stories.ts
- spinner.stories.ts
- switch.stories.ts
- tab.stories.ts
- tabs.stories.ts
- textarea.stories.ts
- tooltip.stories.ts
- Groupe.mdx
- Holding.mdx
- Reseau.mdx
- Voyageurs.mdx
- docs.d.ts
- docs.json
- bundle.mdx
- composite-elements.mdx
- dist.mdx
- introduction.mdx
- angular.mdx
- formly.mdx
- react.mdx
- v2-v3.mdx
- v3-v4.mdx
- v4-v5.mdx
- v5-v6.mdx
- v6-v7.mdx
- accessibility.mdx
- changelog.mdx
- Components-Overview.mdx
- Introduction.mdx
- Palette-Autogen.mdx
- template.mdx
- testing.mdx
- theming.mdx
- ADR-0001-resolving-select-display-text-in-editable-field.mdx
- template.md
- design-token-wcs.drawio
- design-tokens.mdx
- wcs-design-tokens-diagram.png
- wcs-design-tokens-from-JSON-to-css.drawio
- wcs-design-tokens-from-JSON-to-css.png
- Good-practices.mdx
- Introduction.mdx
- args-generation.ts
- .babelrc.json
- .editorconfig
- .eslintrc
- .gitignore
- .gitlab-ci.yml
- .npmrc
- CHANGELOG.md
- CONTRIBUTING.md
- custom-elements.json
- LICENSE
- package-lock.json
- package.d.ts
- package.json
- playwright.config.ts
- README.md
- stencil.config.ts
- TODO_NEXT_MAJOR_RELEASE.md
- tsconfig.json
# CDN으로 사용하기
jsDelivrjsDelivr는 공개 GitHub 리포지토리를 별도 설정 없이 CDN으로 즉시 서빙합니다. 버전과 파일을 고르면 웹페이지에 바로 붙일 수 있는 링크와 예시 코드가 만들어집니다.
명령어 용어집
이 문서에서 사용된 명령어를 모아봤습니다. 낯선 명령어가 있다면 펼쳐서 확인해보세요.
git clone
설명 보기 ▼
git clone
Clone an existing repository.
git clone {{remote_repository_location}} {{path/to/directory}}
Clone an existing repository into a new directory (the default directory is the repository name):
git clone --recursive {{remote_repository_location}}
Clone an existing repository and its submodules:
git clone {{[-n|--no-checkout]}} {{remote_repository_location}}
Clone only the `.git` directory of an existing repository:
ng build
설명 보기 ▼
ng build
Compile an Angular application or library into an output directory named `dist/`.
ng {{[b|build]}}
Build an Angular application or library:
ng {{[b|build]}} --output-path {{path/to/directory}}
Specify the output path relative to the workspace root:
ng {{[b|build]}} --aot
Enable Ahead-of-Time (AOT) compilation:
ng serve
설명 보기 ▼
ng serve
Build and serve the application, rebuilding on file changes.
ng {{[s|serve]}}
Start the application:
ng {{[s|serve]}} {{[-o|--open]}}
Start the application and open it in a browser:
ng {{[s|serve]}} --port 4201
Start the application on port `4201`:
npm install
설명 보기 ▼
npm install
Install Node packages.
npm {{[i|install]}}
Install dependencies listed in `package.json`:
npm {{[i|install]}} {{package_name}}@{{version}}
Download a specific version of a package and add it to the list of dependencies in `package.json`:
npm {{[i|install]}} {{package_name}} {{[-D|--save-dev]}}
Download the latest version of a package and add it to the list of dev dependencies in `package.json`:
npm run
설명 보기 ▼
npm run
Run a script.
npm run
List available scripts:
npm run {{script_name}}
Run a script:
npm run {{script_name}} -- {{argument}} {{--option}}
Pass arguments to a script:
npm start
설명 보기 ▼
npm start
This command is an alias of `npm run start`.
tldr npm run
View documentation for the original command:
npm test
설명 보기 ▼
npm test
This command is an alias of `npm run test`.
tldr npm run
View documentation for the original command:
