To install the widget you need to have an npm token. To obtain it, please contact us on our Discord.
Then create a .npmrc
file at the root of your repository and provide the token in it
//registry.npmjs.org/:_authToken=
Adding the widget in NextJS requires adding the transpile module package
Why ?
This plugin aims to solve the following challenges:
- code transpilation from local packages (think: a monorepo with a styleguide package)
- code transpilation from NPM modules using ES6 imports (e.g lodash-es)
yarn add next-transpile-modules
Then on next.config.js
file, add the following to import the widget as a transpiled module
const withTM = require("next-transpile-modules")(["@0xsquid/widget"]);
const nextConfig = {
// Your nextjs config
};
module.exports = withTM(nextConfig);
You can use the widget with default values like this
import { SquidWidget } from '@0xsquid/widget';
// ...
<SquidWidget />
If you want to customize it, you can use our playground and also take a look at our documentation.
Example
<SquidWidget config={
companyName:"Squid",
slippage:3,
// customization config
} />