@matejkucera/flexmat

Build

Use build.sh script to build the package

Development

WARNING: NPM link has to be active even in docker development environment, or the hot reloading won't work.

Local Development

1. Use npm link to link to the test project

cd /projects/flexmat/flexmat    # go into the package directory
npm link                    # creates global link
cd /projects/flexmat/flexmat   # go into some other package directory.
npm link @matejkucera/flexmat              # link-install the package

2. Run npm run dev in the test project (do not use docker development environment)

Docker Development

Development could be done in docker as well. The package has to be linked as volume, eg.:

volumes:
    - ../:/app
    - /projects/flexmat/flexmat:/app/node_modules/@matejkucera/flexmat

Deployment to npmjs

Deploy to npmjs using: TODO

SASS Styles

FLEXMAT has multiple variables specified in src/assets/scss/variables.scss file. These variables are used the styles, containing mailny colors, margins, paddings etc.

In the App that uses FLEXMAT, you can override these variables. In the main style.scss file of the App, import first variables of the App, then scss of FLEXMAT. Maintain the order.

// 1. Import overriding variables from the App
@import 'variables';
// 2. Import FLEXMAT styles
@import '@matejkucera/flexmat/src/assets/scss/style';

Known Issues

During Development

Uncaught SyntaxError: ambiguous indirect export: default

It may be caused by some invalid build, build cache etc.

1. Stop flexmatdemo docker
2. Build flexmat using build.sh
3. Apply npm link (see above), both to package and the testapp
4. Run flexmatdemo docker