Using your own fork of Next.js - npm

How would you use your own fork of Next.js in a project?
I tried using patch-package but the next package gets overridden by Vercel
Also tried releasing to npm but it's pretty difficult since it needs to release to many #next/ packages first
How would you go about this?

Some people frown on this technique, but I've used it in many projects with great success.
tl;dr - fork the repo on git and install directly from git. Works with monorepos by using GitPkg.
Fork the repository you want on git
Clone your new fork: git clone https://github.com/<your-user-name>/<package-name>
Make any changes and push those changes. Take note of the commit hash.
Install the dependency using the following format:
npm install <your-user-name>/<package-name>#<commit-ish>
Important: replace the <commit-ish> with the hash from Step #3 (note: a tag or branch name works too). This step is important as it makes sure you are locked to a specific version.
If you are referencing a monorepo, you can specify the subdir for the particular package you want by using GitPkg.
Continue working like you normally would. As you make changes to the package, you will need to push those changes and repeat Steps #3-4 to get the new changes in your project.
Keeping things up-to-date
To update the package, you will need to merge any new "upstream" changes made by the original author and push those to your forked repository. Then repeat Step #4 above.
Add the original "upstream" remote:
git add upstream https://github.com/vercel/next.js.git
Pull down any changes and merge them - make sure to reference the right branch name:
git fetch upstream
git checkout <main-branch>
git merge upstream/<main-branch>
Resolve any merge conflicts and then push to your fork: git push origin
Repeat step #4 from above for installing the latest changes - make sure to pick a new commit hash or tag in order to get the latest changes.

Related

How to get the version of a remote npm package using a bin script

I'm trying to set up an npx script to create a template project.
In package.json I have:
"bin": {
"init": "bin/init"
}
In the init script I'm using tag='v'$(npm pkg get version | tr -d '"') to get the version of the package. I then use git clone --depth 1 --branch $tag https://github.com/matriarx/typescript.git to clone that specific repository for that specific tag.
When I do yarn link and try use it locally, from within that specific project, it works because it's able to correctly pick up the package.json version. So the above only works if it's run inside an existing project. However that's not what I want to do.
I want to enable someone to run it even if they have nothing locally, by simply doing npx #matriarx/typescript init and it should create the new project by cloning it. More than that I want them to be able to clone any specific version by using npx #matriarx/typescript#0.0.1 init in order to clone a specific version.
However it seems that anything I try is only able to get the version from a local package.json that already exists.
I could just clone the current existing repository without specifying any tag, but that would defeat the point of having releases, then it would just clone any current code completely disregarding the release. So it has to clone the tagged release.
How can I get the remote package version stored on npm from the bin script without having anything locally before hand?
Alternatively is there a better way to do what I'm trying to do?
EDIT: I ended up just hardcoding the version in the script, which works but it sucks because it's tedious to have to update it every time I bump the version. Though for now I still don't know a better way to do it.
After some more time messing around I figured out there is a standard way of doing it, at least since npm 7.
If you have a project like example then you can create a completely separate project called create-example with a bin script.
When you use npm init example, npm will automatically search for a package prefixed with "create-" and execute its main bin script. So when running npm init example it will search for that create-example package and execute the bin script, which will install the example package.
This is how most of the bigger packages like react and next do it.
This approach comes with some disadvantages that I really don't like, for example it will show the incorrect dependencies on npm and it will cause you to have to maintain multiple projects and semvers on different projects. However it will also allow you to create a clean separation between the actual project and the installation of that project.
For some projects it might also make a lot more sense. For example if you have a project that doesn't have a package.json at all and you want to create a setup for it, it wouldn't make sense to create an npm package inside that project just for that. Instead you can create a separate "create-project" package just to set it up and keep npm out of the actual project. In other words it gives you a neat way to create bin scripts for a completely separate project that doesn't have anything to do with npm.
You could also just have created a normal shell script and execute it using curl but I guess npm just gives you another way to do it.
You still have to hardcode the version in that "create-project" package, I still have not seen a way to automatically determine the version from a remote package. The only way I've managed to do that is to completely download the package, get the version, then delete it, but that would be terrible for people with a slower internet connection or limited data.

Permanent fix for lockfileVersion of npm-shrinkwrap to lockfileVersion#1, it automatically makes lockfileversion#2?

I am getting this when I am trying to push my code into github actions or building dockerimage.
shell: /usr/bin/bash -e {0}
npm WARN read-shrinkwrap This version of npm is compatible with lockfileVersion#1, but package-lock.json was generated for lockfileVersion#2. I'll try to do my best with it!
I tried to implement this Link it works but again after some commit I am getting the same error and I have to repeat the same procedure again and again.
Any fix for that?
Look in your .gitignore if you have the lines :
package-lock.json
node_modules/
if not,then add them,
after that look in your Github repository and delete the package-lock.json file and the node_modules directory (if any)
Important Edit :
My bad, Kevin Martin is right the official documentation tell us to add it to the repository for CI/CD.
This file is intended to be committed into source repositories, and
serves various purposes:
Describe a single representation of a dependency tree such that
teammates, deployments, and continuous integration are guaranteed to
install exactly the same dependencies.
Provide a facility for users to "time-travel" to previous states of
node_modules without having to commit the directory itself.
To facilitate greater visibility of tree changes through readable
source control diffs.
And optimize the installation process by allowing npm to skip repeated
metadata resolutions for previously-installed packages.
But for my case (Azure Devops) i had a lot of trouble with it.

committing to repository as part of CI build

I have a CI pipeline that is likely doing something semi-perverted. Let's not debate that part.
As part of the CI, I will generate an artifact (README.md) which I would like to commit and push back to the same repository. Simply using git push origin ... doesn't work due to authentication error.
Am I constrained to using something like a secret variable and a token, and adding another remote so that it can push?
There are ways to add a ssh token to your build runtime which is able to commit or even do a push to origin.
I think even recently GitLab added a new functionality that for each build a unique token is generated which can be used for same sake.
However in general I dont think you can commit anything on the same git base that build is running on, as the check out is in a detached head mode. This means you will not be able to add to history, specially in a remote.
Next problem to consider is what this means if you were able to commit back for the build system, which can potentially trigger another build and a cycle will be triggered.
So probably either use the artifact system for it or do add the ssh token and clone/checkout/commit/push in a separate directory during the build. Anyway this doc explains how to add the token: https://docs.gitlab.com/ee/ci/ssh_keys/README.html
Gitlab seems to change .git folder after fetching project for CI job. I'm not sure it changes only remote section. So I found only solution is to add gitlab-runner user with sshkeys to gitlab. And in my job make git clone in separate folder, make changes, then commit and push it.

IntelliJ: How to create a local Java project copy for backup?

I'm new to JavaFX 8 and the IntelliJ IDE. I have a JavaFX8 project that works but not as I would like. I'd like to try another approach but the substantial changes may not work. I don't want to loose code I have working.
To save code I have working, I've been creating a new project and then locally copying all the folders(.idea, out, src) and files except .iml, of the working project into the appropriate folders in the new project with the newly generated .iml.
This always seems to work but is it proper procedure?
I'm not on a team of developers and have yet to learn Git/GitHub.
Please advise. Thanks.
Maybe you should learn how to use a Version Control System like Git, then you can create a project repository and have different branches for things you want to try out. Keeping the working code in your master branch will prevent you loosing your working code. Also, when using a vcs you can always revert to versions of your code that have been working. The IntelliJ Idea IDE has perfect support for working with all different types of version control systems. If you don't want to learn any forms of vcs then there is no other way to "backup" your working code.
Is it proper procedure? It's probably not how most people would go about achieving what you want to achieve but it's certainly workable. If you wanted to stick with that for simplicity now, I'd copy the whole directory structure, delete the .idea and .iml files, and then create a new project in IntelliJ on that clean copy: IntelliJ will automatically set up folder structure based on the existing source without you having to go through any additional manual setup.
If you're willing to experiment with the git route, to achieve the basics of what you want to achieve is not very complicated and I've written a small quick-start below. IntelliJ offers very good support for Git, and once your repository is created you can do everything you need from the IDE. I'm going to assume you're working on Windows, although the steps shouldn't be too far removed on other platforms.
Install Git
You can download and install Git from https://git-scm.com/download/win, which will install a command shell called Git Bash.
One-off setup for your project
Open up git bash and go into the directory containing your source. Rather than seeing separate drives as Windows does, Git Bash assumes there is a logical 'root' directory under which all your files are accessible. Your C: drive will be /c. To move around you can use cd to change directory (using / instead of ) and ls to list files instead of using dir.
Assuming your source code is in C:\projects\myproject:
cd /c/projects/myproject
git init
The second line above creates a git repository in that directory. This doesn't affect your code, it just creates a folder called .git that contains all of the book-keeping information.
You don't want to have every file under version control - in particular you don't want your build outputs. You need to set up a file in your project directory called .gitignore which tells git which files and directories should be ignored. As a starting point you can copy https://github.com/github/gitignore/blob/master/Java.gitignore and rename the file to .gitignore
Basic Commands and committing your initial version
There are a small number of basic commands:
git status
Running git status will tell you which files have been modified, which are not under version control, and which files have been added to the staging area to be committed next time.
git add path/to/file
This adds a file to the staging area waiting to be committed. You can add multiple files to the staging area before committing them in one go.
git commit -m "description of your change"
This commits all of the staged files as a new version, which the specified commit message.
If you go into your project directory, do a git status and check through the list to make sure there's nothing you don't want to have under version control, then you can do git add . to add everything to the staging area and git commit -m "Check in initial version of the source code" to commit it to the repository.
After you've committed, you can run
git log
To see a history of all of the changes. IntelliJ has a view that will show you the same thing.
Creating an experimental branch
This is where git shines; if you want to try something experimental you can create a branch of your project while allowing git to preserve the original version.
git checkout -b experiment1
Will create and switch to a branch called experiment1. You can delete, rename, move, rewrite and develop whatever you like on this branch. The changes you commit will be independent of your original working version.
You can switch back to your original version (preserving all of the changes you've committed on that branch) using:
git checkout master
Where master is just the name of the default branch created when you ran git init. The experimental version will still be there and can be switched to again using git checkout experiment1 or from IntelliJ using the branch selection in the bottom right corner of the status bar.
If you decide that the changes you've made in experiment1 are to become your new "good" version, you can merge them back into the master branch and repeat the cycle from there.

Symfony2/Git/CloudControl switching from Composer to Submodules

I need to switch from Composer (which is used by Symfony2 by default) to Git submodules.
I thought I could just add the desired submodules to the desired locations, thus overwriting the current version which was installed by Composer.
But when I use git submodule add, it says:
'vendor/twig/twig' already exists in the index
So I tried:
git rm vendor/twig/twig
and tried to add the submodule again, same error.
What am I doing wrong?
I'm founder and ceo of cloudControl. Currently composer does break our image building process because it interferes with the logic we have to detect submodules in some way. The team is aware of this problem and working to fix the underlying issue.
I'm working for cloudControl and we've been lately inquiring into this issue.
Regarding the original problem, you proposed already a right solution for replacing the composer packages by git submodules, it was just a git commands issue. But doing this doesn't make much sense, as long as these git submodules are identical to the Composer packages and your php code is still hanging on the autoload.php provided by Composer.
We don't process internally Composer yet, their files are just added into the repository and the php code requirements make the rest. However we do process git submodules, so if you want to make a real switch from Composer to Git Submodules, the best option is getting rid of Composer files (vendor folder and composer.* files), adding git submodules wherever you want and handling again the php dependencies . Thus everything should work fine and you'd have switched completely to git submodules.
Native support for Composer is in our future plans.
The problem was that i had to actually delete and git-remove the repository first.
i.e. for twig what i did in the end was:
git rm -r vendor/twig/*
rm -r vendor/twig/*
git add vendor/.
git submodule add git://github.com/fabpot/Twig.git vendor/twig/twig
git submodule add https://github.com/fabpot/Twig-extensions.git vendor/twig/extensions
Now i have twig and twig extensions as a git submodule and can use it in my cloud application.