open-index/open-npm huggingface dataset:
npm package: @skypack/ds
Description: Design System (DS) for Skypack
Latest version: 0.0.12

# skypack-ds

👉 [skypack-ds.vercel.app](https://skypack-ds.vercel.app)

## 🚀 Dev

```
npm i
npm run storybook
```

## 👨‍🚀 Deployment

```
npm run build
npm version
npm publish
```
npm package: @skypack/export-map-test
Description: Test package that illustrates different export map scenarios
Author: drewpowers
Latest version: 0.0.1

# @skypack/export-map-test

Package that illustrates different ways to expose entry points via `package.json`’s `"exports"` field ([see Node.js docs](https://nodejs.org/api/packages.html#packages_package_entry_points)).

```
npm i @skypack/export-map-test
```

### Conditions:

- ✅ `@skypack/export-map-test` (main entry): should import `./module.js` if using the export map
- ✅ `@skypack/export-map-test/simple`: should import `./simple.js`
- ✅ `@skypack/export-map-test/conditional`: should import **one** file in `./conditional`, depending on your criteria
- ✅ `@skypack/export-map-test/wildcard/css.css`: should succeed (as should `…/js.js` and `…/svg.svg`)
- ✅ `@skypack/export-map-test/wildcard-js/one`: should only be able to import any `.js` file without the extension (`one`, `two`, `three`)
- ❌ `@skypack/export-map-test/wildcard-js/css`: should fail (as should `svg`)
- ✅ `@skypack/export-map-test/package.json`: should succeed
- ❌ `@skypack/export-map-test/README.md`: should fail
npm package: @skypack/package-check
Description: A quality score checker for npm packages.
Author: Fred K. Schott
Latest version: 0.2.2

# @skypack/package-check

A quality score checker for npm packages. More documentation coming soon!

```
# yarn (run this in your package directory)
yarn add @skypack/package-check --dev
yarn run package-check
```

```
# npm (run this in your package directory)
npm install @skypack/package-check --dev
npx package-check
```


## CLI Arguments

- `--cwd [./pkg]`: Change the tested package directory. Defaults to your current working directory.
npm package: @skypager/apps-portfolio-browser
Description: an api and application for browsing a portfolio
Author: Jon Soeder
Latest version: 1.1.1

# Skypager Portfolio Browser

This app uses the following components:

- [@skypager/features-package-manager](../../features/package-manager)
- [@skypager/features-module-manager](../../features/module-manager)

To let you browse the module graph of the @skypager portfolio / monorepo, as well as all of its various npm dependencies.

## Graph Explorer

We generate graph data structures based on the package.json found in the module graph (node modules) or the package graph (monorepo subprojects)

```javascript
const runtime = require('@skypager/node')

await runtime.fileManager.startAsync()
await runtime.packageManager.startAsync()
await runtime.moduleManager.startAsync()

const packageGraph = await runtime.packageManager.exportGraph()
const moduleGraph = await runtime.moduleManager.exportGraph()
```

These graph data structures are easy to plugin to [Cytoscape](https://js.cytoscape.org)

The Graph Explorer page lets you experiment with different cytoscape layouts, and has an in-progress 
ui for controlling all of the available options for these layouts.

## Running The App

If you've cloned the skypager repo, and have installed the dependencies, then from the root 
you can start this app by runing: 

```shell
$ yarn start portfolio-browser
```

Or if you're in the portfolio-browser folder, then running the following will start the app.

```shell
$ yarn start
```
npm package: @skypager/cli
Description: the skypager CLI
Author: Jon Soeder
Latest version: 1.4.2

# Skypager CLI

The Skypager CLI provides the `skypager` executable.

## Installation

Install using npm or yarn

```shell
# install with npm
$ npm install @skypager/cli --save
# or if you use yarn
$ yarn add @skypager/cli --save
```

## Provided Scripts

- **console** starts an interactive console using the [Skypager REPL Helper](../../helpers/repl)
- **start-and-test** starts a server and runs a test command
- **serve** starts a skypager server in the project
- **run-all** runs multiple package.json scripts, supports monorepos
- **socket** starts a skypager/node process with an ipc socket listener, once started can run scripts

If you have [Skypager Webpack Utilities](../webpack) installed, you will get the following commands:

- **build** runs a webpack compiler script
- **start** starts a webpack dev server
- **watch** starts a webpack compiler in watch mode

If you have [Skypager Devtools](../main) installed, you will get the following commands:

- **test** runs mocha-webpack in your project. 

## Script Runner

The `skypager` cli will run whatever script you tell it.  

It will look for scripts in the current folder's `scripts` directory and prioritize those.

```shell
$ skypager build
$ skypager console
$ skypager test
```

When running `skypager build` 

- First it will look in the current working directory for a file called `scripts/build.js`
- If it doesn't find it, it will check `@skypager/webpack/scripts/build.js` -- assuming you have `@skypager/webpack` installed
- If it doesn't find it, it will check `@skypager/devtools/scripts/build.js` -- assuming you have `@skypager/devtools` installed

## ESM / Babel Register Support

If you want / need your script to support babel syntax or es6 modules, you can pass the `--babel` or `--esm` flag to your command.

We will run the script with `--require=esm` or `--require=@babel/register` depending on which one you pass.

## Debugging Support

To enable the debugger, pass the `--debug` or `--inspect` flags to `skypager`

```shell
$ skypager build --inspect
```
npm package: @skypager/clients-npm
Description: a REST client for repository.npmjs.org
Author: Jon Soeder
Latest version: 1.1.1

# NPM Repository Client 

An axios client for working with the npm registry.

Currently supports authorized communications to:

- Fetch info about a package in the npm repository 

## Usage

```javascript
import runtime from '@skypager/web'
import * as NpmClient from '@skypager/clients-npm'

runtime.use(NpmClient)

const npm = runtime.client('npm', {
  npmToken: process.env.NPM_TOKEN
})

npm.fetchPackageInfo('@some/private-repo').then((packageInfo) => {
  const versions = Object.keys(packageInfo.versions)
})
```
npm package: @skypager/devtools
Description: skypager framework developer tools
Author: Jon Soeder
Latest version: 1.4.2

# Skypager Devtools

Provides development tools mainly used in the development of skypager itself.

## Test Script

This provides the following command:

```shell
$ skypager test
```

So assuming your project doesn't have a `scripts/test.js` file it will run the [test script in this project](scripts/test.js)

This script starts the `mocha-webpack` command for you, with the webpack build config that `@skypager/webpack` finds for your project.

## Default Test Setup

Mocha looks in `test/test.js` for a global test setup file.  If you have one, we'll use that.  If you don't provide one, by default we'll load
the [following default](testing/mocha-test-setup.js)

```javascript
// Load Test Environment Utilities
const chai = require('chai')
const should = chai.should() // eslint-disable-line
chai.use(require('chai-like'))
chai.use(require('chai-things'))
chai.use(require('chai-as-promised'))
const sinon = require('sinon')
const sinonChai = require('sinon-chai')

chai.use(sinonChai)

global.expect = chai.expect

// sinon provides test spies
global.sinon = sinon
```

## Libraries Used

- [Mocha Webpack](https://github.com/zinserjan/mocha-webpack#readme)
- [Chai.js](https://chaijs.com)
- See other libraries in [package.json](package.json)
npm package: @skypager/features-browser-vm
Description: a vm for running scripts in a jsdom context
Author: Jon Soeder
Latest version: 1.1.1

# Browser VM

This feature makes it easy to take a chunk of javascript code as a string,
and run it as if it were inside of a browser using JSDOM.  You will get back the 
code, the result of the code, and the global context variable in a state after the script ran. 

```javascript
import runtime from '@skypager/node'
import '@skypager/features-browser-vm'

const browserVm = runtime.feature('browser-vm')

async function main() {
  const webpackBundledApp = await runtime.fsx.readFileAsync(runtime.resolve('build', 'app.js'))
  const { result, context } = await browserVm.runScript(webpackBundledApp)
  const { App } = context

  console.log('App Component', App)
}

main()
```
npm package: @skypager/features-file-manager
Description: an observable state machine for a projects files
Author: Jon Soeder
Latest version: 1.4.0

# Skypager File Manager Feature

The File Manager provides an interface for browsing / searching / manipulating the file contents inside of a project.

Under the hood it uses `git ls-files` to find all of the files in the project.

[File Manager API Docs](docs/api/file-manager.md)

## Package Manager

In addition to the file manager, a package manager feature is used to work with all of the package.json manifests that may be found inside a project.

This is especially useful for monorepos and yarn workspaces.

[Package Manager API Docs](docs/api/package-manager.md)

## Module Manager

In addition to the file manager and package manager, the module manager feature is used to work with all of the package.json that can be found in the project's node_modules hierarchy.

[Module Manager API Docs](docs/api/module-manager.md)

## Servers

This feature provides two servers which are implementations of the [Skypager Server Helper](../../helpers/server)

- **File Manager API** - provides a REST API for browsing the project's files.  
- **Package Manager API** - provides a REST API for browsing the project's package.json manifests

## Feature API 

```javascript
import runtime from '@skypager/node'

async function main() {
  // start the file manager
  await runtime.fileManager.startAsync()
  // list all the file ids
  console.log(runtime.fileManager.fileIds)
  // list all the directory ids
  console.log(runtime.fileManager.directoryIds)
  // find a file
  const file = runtime.fileManager.file('package.json')
  console.log(file)

  // find all files matching a route pattern
  const components = runtime.fileManager.matchRoute('src/components/:componentName*.js')

  // calculate the md5 hash of all package.json files
  await runtime.fileManager.hashFiles({
    include: [/package.json$/]
  })

  const hash = runtime.file('package.json').hash
  console.log('hash', hash)
}

main()
```
npm package: @skypager/features-package-manager
Description: an observable state machine for a projects packages
Author: Jon Soeder
Latest version: 1.4.0

## Package Manager

the package manager feature is used to work with all of the package.json manifests that may be found inside a project.

This is especially useful for monorepos and yarn workspaces.

[Package Manager API Docs](docs/api/package-manager.md)
npm package: @skypager/features-redis
Description: skypager runtime redis integration
Author: Jon Soeder
Latest version: 1.1.1

# Redis Feature

Provides a wrapper around the node redis client that will self configure based on the runtime settings and process.env

## Usage

```javascript
const runtime = require('@skypager/node')
const redisFeature = require('@skypager/features-redis')

runtime.use(redisFeature, {
  url: process.env.REDIS_URL
})

runtime.redis.async.keys('*').then((keys) => console.log('Redis KEYS', keys))
```

## Async Wrapper

The `redis.async` property returns promisified versions of all of the core redis commands 

## Pubsub

The redis feature can maintain two clients, one that is in subscribe mode, and another that is free to publish and run any other command.

```javascript
runtime.redis.subscribe('channel', (message) => {
  console.log('got message')
})

runtime.redis.publish('channel', 'some message')
```
npm package: @skypager/features-webpack
Description: programatically manage webpack compilations
Author: Jon Soeder
Latest version: 1.1.1

# Browser VM

This feature makes it easy to take a chunk of javascript code as a string,
and run it as if it were inside of a browser using JSDOM.  You will get back the 
code, the result of the code, and the global context variable in a state after the script ran. 

```javascript
import runtime from '@skypager/node'
import '@skypager/features-browser-vm'

const browserVm = runtime.feature('browser-vm')

async function main() {
  const webpackBundledApp = await runtime.fsx.readFileAsync(runtime.resolve('build', 'app.js'))
  const { result, context } = await browserVm.runScript(webpackBundledApp)
  const { App } = context

  console.log('App Component', App)
}

main()
```
npm package: @skypager/helpers-container
Description: skypager container helper
Author: Jon Soeder
Latest version: 1.1.1

# Container Helper

The Container Helper is used to represent docker images which have been built by docker.

It represents all images for a particular docker container by its unique name.  A docker container with a unique name can still have multiple tags, and image ids, based on how many times it has been built and changed.

If you modify a docker container, it will have a new imageId / hash value.

## Usage

```javascript
import runtime from '@skypager/node'
import * as ContainerHelper from '@skypager/helpers-container'

runtime.use(ContainerHelper)
```

This will create a registry of containers on `runtime.containers` and a factory function cor creating instances of containers by its unique name.

## Discovering Containers

You can discover which containers have already been built on the system by running

```javascript
runtime.containers.discover()
```

And see which ones have been found

```javascript
runtime.containers.available
```

And then create an instance of the Helper object to represent that container

```javascript
runtime.container('node')
```

## What can you do with it?

You can see the various docker configuration values

```javascript
const { env, workingDir, entryPoint, cmd } = runtime.container('node')
```

You can see all available tags, all the containerIds and container names for any running instances of the image

```javascript
const { isRunning, tags, containerIds, imageIds } = runtime.container('node')
```

You can start an instance of the image

```javascript
runtime.container('node').start()
```

Or execute a command in a running instance of the container

```javascript
runtime.container('node').exec('ls -al')
```
npm package: @skypager/helpers-crawler
Description: skypager crawler helper
Author: Jon Soeder
Latest version: 1.4.4

# Skypager Server Helper 

The Skypager Server Helper is used to provide a standard interface on top of any node.js server that you can think of.

By default, we provide an [express](https://expressjs.com) based server, with optional:
  - CORS support 
  - history fallback support 
  - static file serving

This helper is automatically loaded by the [Skypager Node Runtime](../../runtimes/node)

## Helper Interface

A Server Helper module is any module which exports one of our functions or properties

- **cors** export true, or a function which returns true, if you want to enable cors support.  export an object or a function which returns an object to provide options to the cors module.
- **history** export true, or a function which returns true, if you want to enable history api fallback to an index.html file 
- **serveStatic** export true, or a function which returns true, if you want to enable static file serving from the project's build folder.
- **appWillMount** export a synchronous function, this function will be passed an instance of `app` which is usually your express server.  Do whatever you want in this function,
  such as define routes on app
- **appDidMount** export an asynchronous function, this function will be called right before the server starts. use this function to add additional routes,
or do any sort of logic that relies on some asynchronous data
- **serverWillStart** export an asynchronous function, this function will be called after the `appDidMount` hook.  Use this function to prepare any external
services your server might need to connect to when handling requests
- **serverDidFail** export a function which will be called when the server fails to start 
- **displayBanner** export a function which will be used when the server stars to display console output
- **endpoints** export an array or a function which returns an array of endpoint module ids to use.  endpoint modules can be registered with the runtime.endpoints registry

## Registries

With the server helper, you'll have a couple of module registries on your runtime

**Endpoints Registry**

```javascript
runtime.endpoints
// register one at a time
runtime.endpoints.register('my-endpoint', () => require('./my-endpoint'))
// add a webpack require.context
runtime.endpoints.add(require.context('./src/endpoints', true, /\.js$/))
// or use the node runtime's requireContext to create a similar require context object 
runtime.endpoints.add(runtime.requireContext('src/endpoints'))
// see available endpoints
runtime.endpoints.available
```

**Servers Registry**

```javascript
runtime.servers
// register a server module
runtime.servers.register('app', () => require('./server/app.js'))
// retrieve a server module
runtime.servers.lookup('app')
// see all available servers
runtime.servers.available
```
npm package: @skypager/helpers-repl
Description: an awesome repl!
Author: Jon Soeder
Latest version: 1.4.2

# Skypager REPL Helper

Provides an enhanced REPL which loads the skypager runtime in the context of your current project.

This helper is automatically loaded for the [Skypager Node Runtime](../../runtimes/node)

## CLI Usage

To use the REPL Helper, you can just run the console command with [Skypager CLI](../../devtools/cli)

```shell
$ skypager console
```

## Node Usage

```javascript
const runtime = require('@skypager/node')
const repl = runtime.repl('interactive')

async function main() {
  await repl.launch({
    runtime,
    whatever: 'you pass to launch will be defined in the repl'
  })
}

main()
```
npm package: @skypager/helpers-server
Description: skypager server helper
Author: Jon Soeder
Latest version: 1.4.0

# Skypager Server Helper 

The Skypager Server Helper is used to provide a standard interface on top of any node.js server that you can think of.

By default, we provide an [express](https://expressjs.com) based server, with optional:
  - CORS support 
  - history fallback support 
  - static file serving

This helper is automatically loaded by the [Skypager Node Runtime](../../runtimes/node)

## Helper Interface

A Server Helper module is any module which exports one of our functions or properties

- **cors** export true, or a function which returns true, if you want to enable cors support.  export an object or a function which returns an object to provide options to the cors module.
- **history** export true, or a function which returns true, if you want to enable history api fallback to an index.html file 
- **serveStatic** export true, or a function which returns true, if you want to enable static file serving from the project's build folder.
- **appWillMount** export a synchronous function, this function will be passed an instance of `app` which is usually your express server.  Do whatever you want in this function,
  such as define routes on app
- **appDidMount** export an asynchronous function, this function will be called right before the server starts. use this function to add additional routes,
or do any sort of logic that relies on some asynchronous data
- **serverWillStart** export an asynchronous function, this function will be called after the `appDidMount` hook.  Use this function to prepare any external
services your server might need to connect to when handling requests
- **serverDidFail** export a function which will be called when the server fails to start 
- **displayBanner** export a function which will be used when the server stars to display console output
- **endpoints** export an array or a function which returns an array of endpoint module ids to use.  endpoint modules can be registered with the runtime.endpoints registry

## Registries

With the server helper, you'll have a couple of module registries on your runtime

**Endpoints Registry**

```javascript
runtime.endpoints
// register one at a time
runtime.endpoints.register('my-endpoint', () => require('./my-endpoint'))
// add a webpack require.context
runtime.endpoints.add(require.context('./src/endpoints', true, /\.js$/))
// or use the node runtime's requireContext to create a similar require context object 
runtime.endpoints.add(runtime.requireContext('src/endpoints'))
// see available endpoints
runtime.endpoints.available
```

**Servers Registry**

```javascript
runtime.servers
// register a server module
runtime.servers.register('app', () => require('./server/app.js'))
// retrieve a server module
runtime.servers.lookup('app')
// see all available servers
runtime.servers.available
```
npm package: @skypager/node
Description: the skypager node runtime.
Author: Jon Soeder
Latest version: 1.4.2

# Skypager Node Runtime

This provides a version of the skypager runtime specially tailored for use in a node.js server environment.

## Installation and Usage

```shell
$ yarn add @skypager/node --save
```

## Using in a script

```javascript
const runtime = require('@skypager/node')

runtime.start().then(() => {
  runtime.log(`Oh! World.`)
})
```
npm package: @skypager/portfolio-manager
Description: the skypager portfolio manager
Author: Jon Soeder
Latest version: 1.4.2

# Skypager Portfolio Manager

Provides useful information and capabilities at a portfolio level for your monorepo.

Use it to aggregate information about each project, to run tasks in various projects, etc.

## Usage

```javascript
import runtime from '@skypager/node'
import PortfolioManager from '@skypager/portfolio-manager'

export default runtime.portfolio
```

## Examples

You can generate a dump of the portfolio state

```javascript
runtime.portfolio.dump().then((data) => {
  const {
    // a hash of the package.json contents
    packageHash,
    // a hash of the yarn.lock contents
    yarnLockHash,
    // the current git sha
    gitSha,
    // the current git branch
    gitBranch,
    // the os platform 
    platform,
    // the os arch
    arch,
    // if the portfolio uses lerna, which version is lerna.json set to
    lernaVersion,
    // info about the build state of all the projects in the portfolio
    projectTable
  } = data

  const projectTableEntry = projectTable['@skypager/web']

  // For each project, you'll get the following information
  const {
    // the name of the project
    projectName,
    // a composite md5 hash of all of the build folder output files hashes
    buildHash,
    // a composite md5 hash of all of the source files hashes
    sourceHash,
    // the last git sha and commit message when this project was updated
    lastUpdate,
    // an array of the files in the build folder, their md5 hash, last modified time, size, etc
    outputFiles
  }
})
```

You can spawn a node runtime inside one of the sub projects

```javascript
const nodeRuntimeInsideWebProject = runtime.portfolio.createRuntime('@skypager/web')
nodeRuntimeInsideWebProject.proc.execSync('pwd').toString() // ~/src/runtimes/web
```

You can calculate the source tree hash for just one project

```javascript
runtime.portfolio.hashProjectTree('@skypager/web')
```

You can calculate the build tree hash for just one project

```javascript
runtime.portfolio.hashBuildTree('@skypager/web')
```
npm package: @skypager/react
Description: This provides a version of the Skypager Runtime specially tailored to run in the browser.
Author: Jon Soeder
Latest version: 1.4.2

# Skypager Web Runtime 

This provides a version of the Skypager Runtime specially tailored to run in the browser.

## Installation and Usage

You can use this with any module bundler

```javascript
import runtime from '@skypager/web'
```

Or load it via script tag

```html
<script type="text/javascript" src="https://unpkg.com/@skypager/web"></script>
<script type="text/javascript">
const skypager = window.skypager

skypager.start().then(() => {
  console.log('Skypager Runtime Started')
})
</script>
```
npm package: @skypager/web
Description: This provides a version of the Skypager Runtime specially tailored to run in the browser.
Author: Jon Soeder
Latest version: 1.4.2

# Skypager Web Runtime 

This provides a version of the Skypager Runtime specially tailored to run in the browser.

## Installation and Usage

You can use this with any module bundler

```javascript
import runtime from '@skypager/web'
```

Or load it via script tag

```html
<script type="text/javascript" src="https://unpkg.com/@skypager/web"></script>
<script type="text/javascript">
const skypager = window.skypager

skypager.start().then(() => {
  console.log('Skypager Runtime Started')
})
</script>
```