I'm trying to make modifications to some of the imported libraries that I added using yarn. When I make a change to those libraries under node_modules, and then run react-native run-android, modifications are updated then. But when I run react-native run-android the next time, it gets reset back to the original.
I wanna make changes to it and save it with my custom modifications. How do I avoid it getting reset back to the original library? This question might sound really basic and stupid, but I have no idea how to and I can't find any solution to this when I tried to search a solution for this.
node_modules must not be changed manually as it is assumed to be read-only dependency.
If you still want to change one of node_modules , you have three ways :
Create a pull-request which contains your changes to the repository of this module and follow up with the owner of repository until merge the pull-request and publish your changes in npmjs.com.
Definitely, this solution can take much time which breaks your productivity . If so , the best solution is :
Fork the repository of the module , make changes and if the license allows you , publish your repo under https://npmjs.com using
cd /path/to/your-repo-after-changes;
npm publish;
Then go back to your project and run :
yarn add your-repo-after-changes ;
According to license, you may copy/paste the module source code that you want to change to your project under a folder (external-modules for example) , make your changes and export from external-modules .
Related
I am learning React with my son using VS Code a and we are having a hard time properly syncing and setting up how to work with the same files on Github.
We have a repo with source files. Let's call it 1st-repo. His PC is fine as he has control of the repo (master). I would like to fork this repo (I think?) so I can have all the files and make my own changes.
I'm really not sure how to start in VS Code. DO I first do a blank app "npx create-react-app {name}" then clone? Or do I set it up through git/github in VS code.
Once there is the initial setup I would love to see how people work together.
You definitely don't want to npx create-react-app {name} as this will create a new application project.
If you are simply wanting to work on the same project at the same time then you only need to clone the Github repo to your machine.
git clone <link to repo>
Then change directory into the project and install the project's dependencies. This assumes you already have node installed on your machine.
cd <project directory>
npm install
From here you can open the project up in VSCode, make your changes, and commit & push them back to the remote repo. I suggest getting familiar with Git and the pull, commit, and push commands. Also get familiar with creating and switching between working branches.
Git cheet sheet
If you and your son are working on the same code in the same branch at the same time then merge conflicts will likely arise when either of you are pushing your changes back to the remote. Get in the habit of pulling any changes from the remote before you commit and push your changes, it's easier to resolve conflicts this way. VSCode even makes this stupid simple in the GUI.
VSCode also features a VS Code Share extension, called Live Share, that allows you to work in a shared window. You can see each other's cursors and position in the code.
Good Luck.
I'm wanting to create a React library that I can build locally and that deploys into the NPM global area. I want to be able to use my other React project that also sits on my machine and picks up changes as I modify the library. I have found plenty of tutorials that either deploy to NPM (which I don't want) or that I have no idea how to get it updating automatically to my project. I tried one with rollup.js that seemed to work for a while but then stopped for some reason.
Ideally looking for tutorial or source code that I can look at.
Do's: build locally, automatically update changes to my project
Don'ts: deploy to NPM or another external repository, cause problems when setup on another machine
Want: One library, one project, easy update to the project when the library is changed, be able to create an entry in the global install with the library version
Thanks
Paul
I've inherited an angularjs project and am trying to understand how it's structured and ultimately am trying to add dependencies to it manually. The project structure is below.
It seems like it was created without NPM (notice no package.json files - is my understanding correct about this?). The angular components (ie. our custom code) are in the components folder. The assets has external dependencies, eg. PDFViewer, JWT and other dependencies. Does this mean it's likely the assets were manually copied over, instead of managed by a tool?
Ultimately I want to add a new dependency to the project, specifically this ImageViewer library. Without NPM, I'm clueless about how to do this. Can I add npm to a pre-existing project like this or not? If not, the directions show this alternative.
Does this mean I don't have to manually put anything in the assets folder? I just put these references in app.js and it should pick them up? And then I obviously have to define ImageViewer somewhere in angular module or something to bring it into the project. Or am I completely wrong about all this? I don't know anything on how to manage JS dependencies w/o NPM so any recommendations here are super welcomed!
I would recommend using npm to manage your dependencies where possible as this will make your life easier when it comes to upgrading versions etc.
You can just copy and paste the js files into the assets folder and reference them in your index.html file by using a script tag though, if you want to go that route. This will make the exported object available globally within your application (which may or may not be what you want).
The snippet you've posted above has the script source pointing to an external url, so you don't have to copy and paste anything locally, however your application then has an external dependency on that URL being up and available when your application runs, so that is something to keep in mind as well.
I would recommend trying to go over to using npm to manage your dependencies. It is absolutely possible to just run npm init in the project and to start adding dependencies this way as well. Both approaches can work side by side.
I'm working with react-html-table-to-excel and what I wanted to do was to change the style of the export button. So, I located the file in: node_module/react-html-table-to-excel/src/ReactHTMLTableToExcel.jsx and I changed it how I wanted.
However, when I save the file and refresh the browser, the changes aren't being reflected in the browser. To make sure, I even commented out the whole file and restarted the server and still no changes were made to the export button.
Any help is greatly appreciated!
If you want to change the style, better to update it in global style.css file of the project.
Do not change anything in node_modules. It's not your code. It's library code. It's third-party code. It's subject to being replaced/updated every time someone runs npm install, or clones your repo anew, or when the repo version updates. You have no way to even know if a particular file is used at run-time; the HTML file for a component's template probably is not. The package is a black box. Depending on how the library is packaged, the template may well have been pre-compiled in a build step run before the package was published.
In the very beginning, I created the AwesomeProject. Later when I use command
react-native init MyProject, it only created a package.json there. Before that, it could create other files, but very slow.
I searched some ways to fix it, now it only create one file.
It's a known issue that has been fixed (be sure to update react-native-cli): the command seems to hang forever nothing seems to be downloaded.
Try using react-native init MyProject --verbose to see what's happening and/or keep trying. The issue is not coming from your config.