create-react-web-component's Introduction

Create React Web Component

This project has been deprecated, and will no longer be maintained!

The project is now carried on at Direflow

Set up a React App wrapped in a Web Component

This setup is is based on react-scripts from create-react-app
A thorough description of the principles used in this setup, can be read in this article

Getting Started

Install

Get started by running the command

npx create-react-web-component

Or install the package globally

yarn

yarn global add create-react-web-component

npm
```
npm i -g create-react-web-component
```

This will bootstrap a new project for you.
Now use the following commands:

cd <project-folder>
yarn install
yarn start

Your project will start running on localhost:3000 and your browser opens a new window

Contributing

Issues

In the case of a bug report, bugfix or a suggestions, please feel very free to open an issue.

Pull request

Pull requests are always welcome, and I'll do my best to do reviews as fast as I can.

License

This project is licensed under the MIT License

Get Help

Read more about using Web Components with React on the official React Docs

Contact me on Twitter
If appropriate, open an issue on GitHub

create-react-web-component's People

Contributors

Stargazers

Watchers

create-react-web-component's Issues

Disable shadow root

How can I disable shadow root for the generated web component?

componentTitle not updated when using useState hook

Hi,
I just started tinkering with create-react-web-component. I used create-react-web-component to create a new web component "web-component" without adjusting anything in the created component.

I then copied over the bundle.js to an app I created with create-react-app.

In the "host" app I added a <script src="%PUBLIC_URL%/bundle.js"></script> to the public/index.html and I adjusted the the host App component to be like shown in this gist: https://gist.github.com/huberv/9ac6264239448e58e0f80690aaf40507

The initial rendering of the web component works fine and shows the correct title. However, when clicking the "toggle title"-button, the web component's title is not updated. I'm a bit stumped why.