How to integrate Backpack components into an existing project about backpack HOT 4 CLOSED

Hi @Nerogee! Have a look at backpack-react-scripts - it's a fork of Facebook's Create React App with tweaks to the webpack configuration in order to support backpack components out of the box.

You can check out the webpack configuration inside (have a look in the dev and prod configs). Essentially we have added in a custom regex to include backpack components in babel-loader as well as sass compilation support. See this guide for more details.

Hope this helps!

from backpack.

Closing due to inactivity - feel free to reopen if you need info!

from backpack.

Hey @Nerogee

I appreciate it's a while since you raised this, so might not be at all relevant, but I've published an experimental package called backpack-transpiled which contains all the backpack React components, and uses transpiled js and CSS.

You can check it out here.
https://www.npmjs.com/package/backpack-transpiled

Usage is the same as documented on backpack.github.io, except you have to import from subdirectories within the package. eg:

import BpkButton from 'backpack-transpiled/bpk-component-button';

As I said it's experimental for now, and not officially supported by Backpack or Skyscanner, but it might help 🤷

from backpack.

This is kinda sad that there are no guides (at least I have found none) that can help in this task. Most links from @matthewdavidson comment do not work at this point.
There is one webpack config now, but personally I have no idea what part of it should I merge to the nextjs one we are using.

from backpack.