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

@interaktiv/dia-scripts

v2.2.6

Published

CLI toolbox with common scripts for most sort of projects at DIA

Downloads

42

Readme

dia-scripts 🛠 📦

CLI toolbox with common scripts for most sort of projects at DIA

Commitizen friendly Conventional Commits Semantic Release Code of Conduct MIT License

npm latest version npm next version

The Problem

Every time we start a new project for Javascript, Lightning Web Components, Salesforce, Web or Mobile, we find ourselves copying configuration files or npm run scripts or other tooling stuff from a previous project... such an annoying task and prone to errors.

Also adding some new features for e.g. updating some babel configuration or adding some ESLint rules makes the update process on older projects a pain and not really straight forward.

So we borrowed a nice solution from Kent C. Dodds and his kcd-scripts. Which originally was created as a PayPal internal project called paypal-scripts.

This Solution

This is a CLI that abstracts away all configuration for linting, testing, building, and more.

Table of Contents

Prerequisites

You need

  • Node.js 8+

  • npm CLI 5+ - The npm CLI is shipped with and will be installed during the installation of Node.js. If the version is lower than needed - at least 5.x - you can update it via:

    npm install --global npm

Installation

This module can be installed via npm which is bundled with Node.js and should be installed as one of your project's devDependencies:

npm install --save-dev --save-exact @interaktiv/dia-scripts

Usage

This is a CLI and exposes a bin called dia-scripts. For now the documentation and testing was done very roughly. You'll find all available scripts in src/scripts if you miss something from the docs (README.md 😅).

This project actually runs itself. If you look in the package.json, you'll find scripts with node src {scriptName}. This serves as an example of some of the things you can do with dia-scripts.

Overriding Config

dia-scripts allows you to specify your own configuration for things and have that plug directly into the way things work. There are various ways that it works, but basically if you want to have your own config for something, just add the configuration and dia-scripts will use that instead of it's own internal config.

📌 In addition, dia-scripts exposes its configuration so you can use it and override only the parts of the config you need to.

This can be a very helpful way to make editor integration work for tools like ESLint which require project-based ESLint configuration to be present to work.

So, if we were to do this for ESLint, you could create an .eslintrc.js with the contents of:

{
  extends: ['./node_modules/@interaktiv/dia-scripts/eslint.js'],
}

Or, for babel, a .babelrc.js with:

{
  presets: ['@interaktiv/dia-scripts/babel'],
}

Or, for jest:

const { jest: jestConfig } = require('@interaktiv/dia-scripts/config');

module.exports = Object.assign(jestConfig, {
  // Your overrides here ...

  // For test written in Typescript, add:
  transform: {
    '\\.(ts|tsx)$': '<rootDir>/node_modules/ts-jest/preprocessor.js',
  },
});

📌 Note: dia-scripts intentionally does not merge things for you when you start configuring things to make it less magical and more straightforward. Extending can take place on your terms.

Flow Support

If the flow-bin is a dependency on the project the @babel/preset-flow will automatically get loaded when you use the default babel config that comes with dia-scripts. If you customized your .babelrc-file you might need to manually add @babel/preset-flow to the presets-section.

Other Solutions

We are not aware of any, if you are please [make a pull request][pull-requests] and add it here!

Please consult the contribution guides before contributing.

Other Use Cases

If you lack some use cases / scripts, you are welcome to [open a pull request][pull-requests] and add it. We'll come back to you and see how we can support your use case and present it to all devs.

Please consult the contribution guides before contributing.

Acknowledgements

This tool is inspired by kcd-scripts from Kent C. Dodds. Here are some of his blogs regarding toolkits and kcd-scripts:

License

MIT Copyright © 2019-present die.interaktiven GmbH & Co. KG