Developing Alfred JS SDK

Since I primarily work in frontend development, I tend to write Alfred workflows in JS. But I find myself repeatedly writing Script Filters, parameter splitting and concatenation, etc. This gave me the idea to develop a JS toolkit, so that common code blocks in future workflows can be directly called, which would definitely improve efficiency quite a bit.

Better to act than just think about it, let’s get started.

Here’s the link to my toolkit, click here. For related development, just install and use directly.

If you’re curious about the source code, visit the GitHub repository address.

Here are some design considerations during development.

Tech Stack

• TypeScript
• NodeJS

Other things like UT/hooks/CI are all included

Technical Considerations

• I’m writing this using TS-ESModule, and finally compiling to CommonJS with TSC. Since this only serves Alfred, it’s definitely a Node environment, so I only output the CommonJS version. Of course, if you want to output an ES version, it’s simple - just add a configuration file.

• Current IDEs have excellent TS support, so when TSC compiles, I choose to output .d.ts files

• Using standard-version for server version management

• The entire version release uses GitHub Action for automatic publishing, and when publishing is OK, I get a telegram message notification

• To ensure the library’s robustness, I added hooks for UT detection

Some Pitfalls

• TSC compilation is incremental compilation, so it’s better to rimraf the folder first each time

• Need to understand the differences between .gitignore/.npmignore/Package.json-files, as configuration affects the final published files

• TSC by default compiles all TS files, so you need to explicitly specify which files to include, for example, Test files don’t need compilation

• For user convenience when importing, we often add an index file, and the writing style needs attention

  export {default as http} from './http';
  export {default as utils} from './utils';
  

• TypeScript supports writing CommonJS modules directly, but we can also write modules using ES syntax and finally compile to CommonJS, which is the approach used here

Package Usage

npm install @stacker/alfred-utils --save

const { utils, http } = require('@stacker/alfred-utils');

utils.outputScriptFilter({
     items: utils.filterItemsBy(items, query, 'title')
});

The above is a simple usage of the toolkit.

Final Thoughts

The toolkit abstracts and encapsulates common operations during development, so that specific usage only requires consumption. Developing workflows in the future can be faster and safer.