Lost Pixel
Search
⌃K

Project Configuration

Each project needs a configuration file that sits inside the Git repo of the project.
To get started you can use the init command to create an initial configuration which uses storybook by default, you can change the mode in the config file later:
npx lost-pixel init-js
This will create a new file lostpixel.config.js that looks the following way:
module.exports = {
storybookShots: {
storybookUrl: 'examples/storybook-build/storybook-static',
},
generateOnly: true,
};

TypeScript

In case you prefer TypeScript (recommended) you will need to do a bit more but will benefit from a much better experience when it comes to configuring the project.
To initialize the configuration run this command:
npx lost-pixel init-ts
We will also need the lost-pixel NPM package to get access to the configuration types. Run this command to add it as a developer dependency:
npm i -D lost-pixel
Finally, we can take a look at the created configuration file lostpixel.config.ts. You can notice that it includes types already, which makes the job of writing the configuration so much easier (IDE IntelliSense, type safety, ...).
import { CustomProjectConfig } from 'lost-pixel';
​
export const config: CustomProjectConfig = {
storybookShots: {
storybookUrl: 'examples/storybook-build/storybook-static',
},
generateOnly: true,
};
Don't forget to include the configuration file in your tsconfig.json