💡 Looking for the Legacy Package Setup Guide?

Setup

Before we start working with our data we need to configure WarpDrive's build plugin and a Store to manage our data.

Configure the Build Plugin

WarpDrive uses a babel plugin to inject app-specific configuration allowing us to provide advanced dev-mode debugging features, deprecation management, and canary feature toggles.

For Ember apps, this plugin comes built-in to the toolchain and all you need to do is provide it the desired configuration in ember-cli-build. For other projects, the configuration is done inside of the project's babel configuration file.

babel.config.mjs

import { babelPlugin } from '@warp-drive/core/build-config';

const macros = babelPlugin({
  // for universal apps this MUST be at least 5.6
  compatWith: '5.6',
});

export default {
  plugins: [
    ...macros.js
  ]
}

Configure The Store

The Store is the central piece of the WarpDrive experience, linking together how we handle requests, the schemas for what our data looks like, how to cache it, and what sort of reactive objects to create for that data.

WarpDrive provides a utility to quickly setup a store configured with recommended defaults.

import { useRecommendedStore } from '@warp-drive/core';
import { JSONAPICache } from '@warp-drive/json-api';

export default useRecommendedStore({
  cache: JSONAPICache,
  schemas: [
     // -- your schemas here
  ],
});

That's it! Unless you need to configure support for legacy (Ember only) features or for migrating from older versions, it's time to start working with your data.

Alternatively, to understand more about what the above setup does, you can read about manually configuring the store in the Advanced Guide