项目作者: Its-Alex

项目描述 :
Proof of concept of a monorepo with yarn workspace/lerna/react CRA
高级语言: JavaScript
项目地址: git://github.com/Its-Alex/poc-frontends-monorepo.git
创建时间: 2020-05-02T23:39:48Z
项目社区:https://github.com/Its-Alex/poc-frontends-monorepo

开源协议:

下载


Frontend monorepo

In this repository, I tried to set up a monorepo to use React
CRA with shared
components and a storybook.

Currently, an issue is opened on
create-react-app
I hope that it will be closed one the day.

Why CRA

Using Create React App is the
best way to follow react update and keep compatibility with new features without
strong knowledge for webpack.

In this repo, I tried to touch the CRA config as little as possible.

What about @react-workspaces/react-scripts

I know that there is another possibility with
@react-workspaces/react-scripts"">@react-workspaces/react-scripts
the problem is that I don’t know what is done inside it and how close to CRA it
is so I prefer to custom a little bit CRA configuration.

Goals

  • [X] Create react app that use shared library from another project
    • [X] Hot reloading
    • [X] Watch
    • [X] Build
    • [X] With asset (image)
  • [X] Storybook that use shared library from CRA and another project
    • [X] Hot reloading
    • [X] Watch
    • [X] Build
    • [X] With asset (image)
    • [X] Using view from React CRA app
    • [X] Using component from shared library

React CRA

With lerna, I add dependencies to common in my-app that allow requiring
files from common.

Hot reloading

I use craco with
get-yarn-workspace
to override CRA configuration and add others repositories to babel-loader in
craco-config.js.

Storybook

I do the same thing that with CRA, storybook has functions to overrides CRA configuration.

Getting started

Install dependencies:

  1. $ yarn install

Start applications:

  1. $ yarn lerna run start

See app:

  • Go to http://localhost:3000
  • Go to http://localhost:9009

Build applications

  1. $ yarn lerna run build

Source links