npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@fattureincloud/fic-design-system

v0.17.6

Published

Fatture in Cloud and Danea design system

Downloads

954

Readme

fic-design-system

Before development

Create a .npmrc file in the design-system directory and paste the following lines:

@fortawesome:registry=https://npm.fontawesome.com/
//npm.fontawesome.com/:_authToken=<YOUR_FONTAWESOME_LICENSE>

Make sure to replace <YOUR_FONTAWESOME_LICENSE> with the real license. Without this step you won't be able to install the FontAwesome Pro dependencies.

Development

yarn storybook

How to test the changes of the Design System in a local environment

If you previously linked projects with yarn link you can unlink them by running:

  • yarn unlink in the design-system root directory
  • yarn unlink "@fattureincloud/fic-design-system" in the project that will use the design system

Install yalc by running the following command:

yarn global add yalc

yalc allows us to work with packages in local, without pushing them to the remote registry

It allows us to have a build of the latest local version of the design system inside the node_modules of our main project

To achieve this we should run the following command in the design system project folder

yalc publish

This will add a folder named @fattureincloud/fic-design-system inside ~/.yalc/packages/ which in turn will contain a folder for every design-system version

eg: ~/.yalc/packages/@fattureincloud/fic-design-system/0.1.83

To link the built version to the main project you should run

yalc link @fattureincloud/fic-design-system

inside the main project folder

From now on once a design system build is executed (yarn build inside the design-system project directory) it will be enough to run yalc push (also inside the design-system project directory) to "send" it to the main project too.

If you need to change the package.json file inside the design system to install new dependencies or change the existing ones you mustn't use the yalc link command. You must run

yalc add @fattureincloud/fic-design-system

Otherwise the design-system version inside the package.json of the main project wouldn't change and the new dependencies would not be installed

WARNING!

Differently from yalc link using the yalc add command the package.json of the main project will be changed, so remember to reset your changes before the commit

Deploy on npm

Bump the package version, using one of the npm commands: npm version patch, npm version minor, npm version major

Trigger the rollup build pipeline

npm run build

Publish on npm

npm publish --access public

npm version creates a commit increasing the version number in package.json, so don't forget to push it:

git push