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 🙏

© 2025 – Pkg Stats / Ryan Hefner

spike-datocms

v2.4.1

Published

quick and easy interface to datocms content

Downloads

22

Readme

Spike DatoCMS Plugin

npm tests dependencies coverage

A quick and easy interface to DatoCMS content

Note: This project is in early development, and versioning is a little different. Read this for more details.

Installation

npm install spike-datocms -S

Usage

Sometimes the best way to see how to use something is an example!

const htmlStandards = require('reshape-standard')
const SpikeDatoCMS = require('spike-datocms')
const locals = {}

module.exports = {
  reshape: htmlStandards({ locals }),
  plugins: [
    new SpikeDatoCMS({
      addDataTo: locals,
      token: 'xxx',
      models: [
        {
          type: 'post', // if you leave this off, it will pull content from all models
          ids: [10, 13], // (optional) only return specific records
          query: 'foo', // (optional) text query for records
          offset: 3, // (optional) offset results
          limit: 10, // (optional) limit number of results returned
          transform: record => {
            // each record is passed through this function, if provided
            // change it however you want and return the modified result!
            return record
          }
        },
        {
          type: 'author'
        }
      ]
    })
  ]
}

Now, in your views, you can see your records as such:

p {{{ JSON.stringify(dato) }}}

Or, for example, loop through one of your models:

ul
  each(loop='post in dato.post')
    li post.title

This plugin will also automatically pull the meta information for the site, including the site title, SEO fields, etc. that you control via the "Settings" menu, and assign it as dato._meta. This makes it super easy to reflect CMS-controlled SEO fields in your layouts.

Single Template Render

Using the template option allows you to write records returned from Dato to single page templates. For example, if you are trying to render a blog as static, you might want each post returned from the API to be rendered as a single page by itself.

The template option is an object with path and output keys. The path is an absolute or relative path to a template to be used to render each item, and output is a function with the currently iterated item as a parameter, which should return a string representing a path relative to the project root where the single view should be rendered. For example:

new SpikeDatoCMS({
  addDataTo: locals,
  token: 'xxx',
  models: [
    {
      name: 'posts',
      template: {
        path: 'templates/post.html',
        output: post => {
          return `posts/${post.slug}.html`
        }
      }
    }
  ]
})

Your template must use the item variable as seen below.

Note: Make sure your template is not ignored by spike, or this functionality will not work

<p>{{ item.title }}</p>

JSON Output

Finally, if you'd like to have the output written locally to a JSON file so that it's cached locally, you can pass the name of the file, resolved relative to your project's output, as a json option to the plugin. For example:

new SpikeDatoCMS({
  addDataTo: locals,
  token: 'xxx',
  models: [{ name: 'posts' }],
  json: 'data.json'
})

You may also choose to have the output written specifically for any content type:

new SpikeDatoCMS({
  addDataTo: locals,
  token: 'xxx',
  models: [
    {
      name: 'posts',

      json: 'posts.json'
    },
    {
      name: 'press',
      id: '4Em9bQeIQxxxxxxxxx'
      // No JSON output needed for this content type
    }
  ],
  // Save all content types data in one file
  json: 'alldata.json'
})

Aggressive Refresh

By default, this plugin will only fetch data once when you start your watcher, for development speed purposes. This means that if you change your data, you will have to restart the watcher to pick up the changes. If you are in a phase where you are making frequent data changes and would like a more aggressive updating strategy, you can set the aggressiveRefresh option to true, and your dreams will come true. However, note that this will slow down your local development, as it will fetch and link all entires every time you save a file, so it's only recommended for temporary use.

Drafts

Passing drafts: true as an option to the plugin will make dato return the latest version of each post, rather than the published version. This is recommended in staging or development.

License & Contributing