zapier-scripts
v7.8.2
Published
Zapier frontend scripts
Downloads
237
Maintainers
Keywords
Readme
zapier-scripts
Zapier Frontend scripts 🤖
This package is owned by the foundations team (#team-foundations), but is deprecated.
The end-goal of this project is to have a CLI executable to be used by Zapier projects that abstracts away configuration for linting, testing, formatting, building, etc.
Note: although this repository is private, the NPM package it publishes to is public.
Installing
yarn add zapier-scripts --dev
Folder structure convention
zapier-scripts
assumes your project will have the following folder structure:
.
├── package.json
├── /node_modules
├── /dist
│ └── bundle.js
├── /src
│ ├── /some-folder
│ │ └── bar.js
│ │ └── bar.test.js
│ └── index.js
└── /tests (legacy, recommend using side-by-side *.test.js)
├── /some-folder
│ └── bar.js
└── index.js
Adopting a folder structure convention allows us to leverage powerful out-of-the-box defaults, as you'll see below.
Usage
zapier-scripts [script] [args]
Where args
are any of the args that you can pass to the inner tool that the script wraps (including file paths),
and script
can be one of the built-in scripts below:
| Script | Description |
| --------------- | ------------------------------------------------------------------ |
| lint
| 👕 Lints code using ESLint |
| test
| 🚨 Runs tests using Jest |
| format
| 💅 Formats code using prettier |
| format-staged
| 💅 Run prettier automatically on your staged files before a commit |
| validate
| 🔍 Runs lint
, test
and format
in parallel. |
All scripts can be called with no extra arguments and zapier-scripts
will use sane defaults, with no extra configuration needed on your part.
Overriding configuration defaults
zapier-scripts
will use sane defaults unless it finds a config file in your project's root for that specific tool.
In that case, your config file takes precedence.
For example, if you don't have an .eslintrc.js
(or .eslintrc.json
) file in your project root, zapier-scripts
defaults to using its internal config file (that extends from eslint-config-zapier).
Note that zapier-scripts
does not do config merging. This is by design.
If you want to have a custom config file that inherits from the default zapier-scripts
config, remember to extend from it.
For example, for ESLint:
module.exports = {
extends: [require.resolve('zapier-scripts/src/config/eslint.js')],
// your custom config stuff goes here
};
Editor integrations
Unfortunately, most editor integrations will only work if the config file is in the project's root.
Luckily, it's easy to get around this: simply create a config file in your project's root that inherits from the default zapier-scripts
' config.
For example, to add ESLint editor integration, add a file called .eslintrc.js
to your project root with the following content:
module.exports = require('zapier-scripts/src/config/eslint');
If you want prettier integration, add a file called prettier.config.js
to your project root with the following content:
module.exports = require('zapier-scripts/src/config/prettier');
Using format-staged
to automatically format all staged files before a commit ✨💅
To run prettier on all staged files automatically before a commit, add a precommit
script to your package.json
like the following:
"scripts": {
"precommit": "zapier-scripts format-staged"
}
Support
- OS X
- npm > 5
Development
If you want to test this package with another package in the monorepo, you don't have anything to do. Your changes will be reflected immediately.
If you want to test this package with an external project, you can test it by yarn install
ing from a local path. yarn link
ing won't work since it doesn't trigger the postinstall script that installs the pre-commit hook.
mkdir zapier-scripts-testing
cd zapier-scripts-testing
yarn install ../zapier-scripts
TODO Checklist
- [ ] Add tests
- [ ] Add documentation sections for each script
- [ ] Refactor code to ES6 and add babel support
Contributing & Publishing
When working on a PR, include a description of what changed in the vNext
section of the CHANGELOG. If there's
no vNext
section, add one.
Before publishing a new version, rename the vNext
section of the CHANGELOG with the correct version number you're
about to publish, then add a new empty vNext
section at the top. Then:
git add CHANGELOG.md
git commit -m "Update CHANGELOG"
npm version [major|minor|patch]
git push --follow-tags
Once your PR has been merged to develop
, you can publish the package with:
npm publish
Inspiration
This is inspired by kdc-scripts and react-scripts.