Dev server

You can start your own local component development server with this command at root:

$ npm run start:dev -- <component-folder-name>

For example:

$ npm run start:dev -- hero

This will:

  • Start a local webserver for the hero component
  • Watch for changes in the src, docs and demo-folder
  • Build the bundle
  • Build the styleguide
  • Live reload the dev index.html file

Local dev server

Almost all componens will have access to their own dev server. It is more lightweight and only focuses on stuff related to the component (it does not compile ifdesignsystem.min.css).

$ cd @ids-core/packages/button
$ npm run dev

> @ids-core/button@14.18.1 dev
> gulp serve

[16:06:09] Using gulpfile ~/Workspace/if/ids-core/packages/button/gulpfile.js
[16:06:09] Starting 'serve'...
[Browsersync] Access URLs:
 --------------------------------------
       Local: http://localhost:3000
    External: http://192.168.86.87:3000
 --------------------------------------
          UI: http://localhost:3001
 UI External: http://localhost:3001
 --------------------------------------
[Browsersync] Serving files from: dev
[Browsersync] Serving files from: dist
[Browsersync] Serving files from: ../core/dist
[Browsersync] Serving files from: ../link/dist
[Browsersync] Serving files from: ../typography/dist
[Browsersync] Serving files from: ../utils/dist
[Browsersync] Serving files from: ../global-footer/dist

NOTE: make sure that the required components that are dependencies of the current component has been build in production mode before starting the dev server!

Table of Contents

Edit this section, Opens in new window
Contact us, Opens in new window