1.11.1 • Published 1 year ago

generation-ui-components v1.11.1

Weekly downloads
84
License
ISC
Repository
github
Last release
1 year ago

Generation UI Components

This project is the library componets for React.

Features

  • Core components
  • Render testing
  • Warning in PropTypes
  • CD&CI to NPM and Preview
  • Definition for develop, staging and production environments
  • Custom Theme for Styled Componets

Content

  1. Architecure
  2. Install
  3. Configure
  4. Deploy
  5. References

1. Architecture

The file structure that we follow is the next:

generation-ui-components
│---README.md
│   wepack.config
│
│---assets
│   └---icons
│          icon1.svg
│          icon2.svg
│---components
│   └---ComponentName
│       │ tests
│       │ __snapshots__
│       │ ComponentName.js
│       │ index.js
│       │ README.md
│       │ ...

2. Install

$ npm install
  • Is required Node 10.16 or higher on your machine
  • Is required React 16 or higher on your machine

3. Run

  • To visualize the Style Guide with all the developed components (the command start is not defined):
$ npm run styleguide

The components will be visible in http://localhost:6060/

  • To connect this library to another project (say, Self Service)
  1. Build the project
$ npm run build
  1. Link this project locally to the project you want to use it. First do:
$ npm link

Then, in the project you want to use it:

$ npm link generation-ui-components
  1. Whenever a change is made on this library that must be reflected on the linked project, build again.

4. Adding external libraries

To mantain the library with a small size, big dependencies should be external To configure a external dependency go to webpack.config.js and add it. For example, if you want to have the external library Happy Feet. You would import it as:

import HappyFeet from 'happy-feet';

So in externals you should add

'happy-feet': {
  commonjs: 'happy-feet', 
  commonjs2: 'happy-feet',
  amd: 'HappyFeet',
  root: 'HappyFeet',
},

In the same file, resolve > alias add:

'happy-feet': path.resolve(__dirname, './node_modules/happy-feet'),

5. Building

Run

npm run build

Check that external libraries are not packed

Run

npm run stats

Navigate to http://chrisbateman.github.io/webpack-visualizer/

Find the generated json file, called webpack-stats.js Verify with the visualizer that your external library wasn't included

5. References

1.11.1

1 year ago

1.11.0

1 year ago

1.10.15

2 years ago

1.10.16

2 years ago

1.10.14

2 years ago

1.10.13

2 years ago

1.10.12

2 years ago

1.10.9

3 years ago

1.10.11

3 years ago

1.10.10

3 years ago

1.10.8

3 years ago

1.10.7

3 years ago

1.10.5

3 years ago

1.10.4

3 years ago

1.10.6

3 years ago

1.10.3

3 years ago

1.10.2

3 years ago

1.10.1

3 years ago

1.10.0

4 years ago

1.9.7

4 years ago

1.9.6

4 years ago

1.9.5

4 years ago

1.9.4

4 years ago

1.9.3

4 years ago

1.9.2

4 years ago

1.9.1

4 years ago

1.9.0

4 years ago

1.8.14

4 years ago

1.8.13

4 years ago

1.8.12

4 years ago

1.8.11

4 years ago

1.8.10

4 years ago

1.8.9

4 years ago

1.8.8

4 years ago

1.8.7

4 years ago

1.8.2

4 years ago

1.8.6

4 years ago

1.8.5

4 years ago

1.8.4

4 years ago

1.8.3

4 years ago

1.8.1

4 years ago

1.8.0

4 years ago

1.7.0

4 years ago

1.6.0

4 years ago

1.5.0

4 years ago

1.4.19

4 years ago

1.4.18

4 years ago

1.4.17

4 years ago

1.4.16

4 years ago

1.4.15

4 years ago

1.4.14

4 years ago

1.4.13

4 years ago

1.4.12

4 years ago

1.4.11

4 years ago

1.4.10

4 years ago

1.4.9

4 years ago

1.4.8

4 years ago

1.4.7

4 years ago

1.4.6

4 years ago

1.4.5

4 years ago

1.4.4

4 years ago

1.4.3

4 years ago

1.4.2

4 years ago

1.4.1

5 years ago

1.4.0

5 years ago

1.3.4

5 years ago

1.3.3

5 years ago

1.3.2

5 years ago

1.3.1

5 years ago

1.3.0

5 years ago

1.2.2

5 years ago

1.2.1

5 years ago

1.2.0

5 years ago

1.1.15

5 years ago

1.1.14

5 years ago

1.1.13

5 years ago

1.1.12

5 years ago

1.1.11

5 years ago

1.1.10

5 years ago

1.1.9

5 years ago

1.1.8

5 years ago

1.1.7

5 years ago

1.1.6

5 years ago

1.1.5

5 years ago

1.1.4

5 years ago

1.1.3

5 years ago

1.1.2

5 years ago

1.1.1

5 years ago

1.1.0

5 years ago

1.0.50

5 years ago

1.0.49

5 years ago

1.0.48

5 years ago

1.0.47

5 years ago

1.0.46

5 years ago

1.0.45

5 years ago

1.0.44

5 years ago

1.0.43

5 years ago

1.0.42

5 years ago

1.0.41

6 years ago

1.0.40

6 years ago

1.0.39

6 years ago

1.0.38

6 years ago

1.0.37

6 years ago

1.0.36

6 years ago

1.0.35

6 years ago

1.0.34

6 years ago

1.0.33

6 years ago

1.0.32

6 years ago

1.0.31

6 years ago

1.0.30

6 years ago

1.0.29

6 years ago

1.0.28

6 years ago

1.0.27

6 years ago

1.0.26

6 years ago

1.0.25

6 years ago

1.0.24

6 years ago

1.0.23

6 years ago

1.0.22

6 years ago

1.0.21

6 years ago

1.0.20

6 years ago

1.0.19

6 years ago

1.0.18

6 years ago

1.0.17

6 years ago

1.0.16

6 years ago

1.0.15

6 years ago

1.0.14

6 years ago

1.0.13

6 years ago

1.0.12

6 years ago

1.0.11

6 years ago

1.0.10

6 years ago

1.0.9

6 years ago

1.0.6

6 years ago

1.0.5

6 years ago

1.0.4

6 years ago

1.0.3

6 years ago

1.0.2

6 years ago

1.0.1

6 years ago

1.0.0

6 years ago