Git Product home page Git Product logo

Comments (6)

k-wilmeth avatar k-wilmeth commented on September 26, 2024

I'm able to get yalc to work with vite however, for live re-load changes I have not found a solution for that.
I am using React 18 and my current process is

from npm package:

npm run build
yalc publish --push
yalc push --sig

then from my React 18 application:

yalc add @myorg/components
npm run build

I have to do those steps everytime I make an update in my npm package to reflect the change in my React application.
I have tried using the --replace flag but it still requires the same commands to reflect new changes.
Does anyone have any solution for this on how to reflect automatic updates with vite? It would make development a whole lot smoother and enjoyable for us. Thanks!

from yalc.

xisenbao avatar xisenbao commented on September 26, 2024

from yalc.

ericskelton avatar ericskelton commented on September 26, 2024

I'm able to get yalc to work with vite however, for live re-load changes I have not found a solution for that. I am using React 18 and my current process is

from npm package:

npm run build
yalc publish --push
yalc push --sig

then from my React 18 application:

yalc add @myorg/components
npm run build

I have to do those steps everytime I make an update in my npm package to reflect the change in my React application. I have tried using the --replace flag but it still requires the same commands to reflect new changes. Does anyone have any solution for this on how to reflect automatic updates with vite? It would make development a whole lot smoother and enjoyable for us. Thanks!

I use yalc in a React vite project and experienced similar issues. The problem is with vites dependency optimization, it doesn't know to reload the dependency everytime it changes. The best solution I've found is to have nodemon watch the .yalc folder and have it restart the dev server with the --force flag to force it to reload the dependencies. This is what my start script looks like

nodemon --signal SIGKILL --watch .yalc --exec npx yarn start --force --no-open

On the library side, I also use nodemon to watch for changes, when it detects a change it builds the library runs yalc push.

It isn't an ideal solution because it takes time for the dev server to restart, especially using the --force flag, but it has worked pretty consistently for the past year or so and all the builds happen automatically which is nice. If you (or anyone else) has come up with a better solution, please let me know

from yalc.

xisenbao avatar xisenbao commented on September 26, 2024

from yalc.

kishanio avatar kishanio commented on September 26, 2024

my existing yalc installation w/ vite stopped working.

from yalc.

xisenbao avatar xisenbao commented on September 26, 2024

from yalc.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.