huozhi / devjar Goto Github PK
View Code? Open in Web Editor NEWlive code runtime for your react project in browser
Home Page: https://devjar.vercel.app
live code runtime for your react project in browser
Home Page: https://devjar.vercel.app
scope the CSS applying logic and sheet creation into the imported CSS module
An easy way is to make all user files start with ./
, and assume other imports are requesting a package from npm. We can either use Skypack or esm.sh for it.
In the future there can be a option to specify the packages and versions. For now you can do import 'react@17'
.
We inject the render target div and script in react effects, which could be a bit slower than when you call load(files)
. Load script take time and now we need to wait until the __render__
function is loaded then we could load files.
Support basic CSS files loading or imports
Make it work with safari..esm.sh/es-module-shims
is 500
For now it's hardcode to esm.sh
, user might want to customize it with other esm CDN origin
Either respect the package version from a specified package.json
or can load the latest version of it from CDN. For instance, react should load react 18 with swr
If a component is using react jsx, dev jar could inject React imports for it
import './style.css';
break evaluator
If I want to add Tailwind CSS as well, what do I need to do?
Currently I inlined all the script as text to avoid the import()
calls to be handled by webpack..But then it's hard to keep sync bewteen core and react subpath exports and debug it like normal js
Hey, I think it may be related to the recent change 560db60, pre
doesn't look like it needs padding
.
Add a button to force reload the entire script
Consider providing loading properly to identify if the script is loading or devjar is reloading the code files
It should support displaying error overlay (for both compilation and runtime errors) inside the iframe and send back the error with stack to the main window.
esm shims requires pretty long time of downloading script and some cdn like esm.sh doesn't handle it so well
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.