Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

How to setup TSDX with an example application for React Native

See original GitHub issue

Current Behavior

Hi guys,

I’m currently working on a React Native library (@nartc/react-native-barcode-mask) and tsdx has been working great for me. However, I found it pretty frustrated to test out new features/bug fixes without an example application.

I’ve been trying to setup an example application that lives outside of the src directory of the lib and trying to link the library source (or dist) to use as a local dependency inside of the example application, but it hasn’t been good. I’ve tried:

yarn link
@nartc/react-native-barcode-mask: "file:./../" or "link:./../" inside example/package.json
module-resolver to resolve the module with the path to ../dist

Desired Behavior

A clear guide/documentations on how to setup an example application (with live reload if possible) for React Native library.

Again, here’s the repo of the library: @nartc/react-native-barcode-mask Any help, at all, is much appreciated. TIA!

PS: Great work on tsdx.

Issue Analytics

State:
Created 4 years ago
Comments:8 (3 by maintainers)

Top GitHub Comments

3reactions

nartccommented, Dec 21, 2019

After spending hours to get this setup properly without success, I’ve currently settled with a hack. Override tsdx with tsdx.config.js to have the build output directly to example/{package_name} which results in the output of the library is just like another module in the example application.

Pros: Setup is easy. Setup a script dev: tsdx watch --localDev. localDev will be available as options.localDev in tsdx.config.js. Use this flag to override config.output.file

Cons: Without further config needed, this hack requires the example app to be in JavaScript instead of TypeScript.

1reaction

nartccommented, Dec 21, 2019

@ambroseus Done

Top Results From Across the Web

TSDX: Introduction

A plain TypeScript project setup you can use for any kind of module. react, A React package with necessary development dependencies and @types...

How to use TSDX - DEV Community ‍ ‍

After migrating react-use-localstorage to TSDX, I wanted to share what TSDX is and how to use it. It's pretty cool as it simplified...

Getting Started with TSDX and Storybook | by Yoav Ganbar

We can see that the TSDX example component is imported there and rendered in the App . We can now run this by...

tsdx-component-lib - npm

This TSDX setup is meant for developing React component libraries (not apps!) that can be published to NPM. If you're looking to build...

Setup TypeScript with React

Meteor: meteor create --typescript name-of-my-new-typescript-app; Ignite for React Native: ignite new myapp; TSDX: npx tsdx create mylib for Creating React+TS ...