はじめに

ゆとり世代の中野です。

今回チャレンジした内容は【React Native Paperの導入】です。

さっそくチャレンジについて書いていきます。

チャレンジする背景

• マテリアルデザインのデザインが使いたい
• Storybookでも動くようにしたい

チャレンジ内容

• React Native Paperの導入

やり方

packageの追加

yarn add react-native-paper
yarn add -D @expo/webpack-config

storybookでreact-native-paperを使うために

• storybookで動作させるために設定が別途必要のため下記の設定ファイルを作成する
• .storybook/webpack.config.js

const { resolve } = require('path');
const { withUnimodules } = require('@expo/webpack-config/addons');

module.exports = ({ config }) => {
  return withUnimodules(config, { projectRoot: resolve(__dirname, '../') });
};

まとめ

• packageの追加すればすぐに使えます
• storybookでも使えるようにするには設定ファイルを作成する必要があります

さいごに

導入自体は簡単に出来ました

関連記事

ExpoにStorybookを導入する

ゆとり世代の中野です。

yutanakano.com

yutanakano

WEBエンジニア

大阪生まれのゆとり世代です

趣味はバイクでツーリングに行くこと

愛車は Ninja ZX-25R SE KRT EDITION

Expoでプロダクトを作っています