Beautify all files before/after a pull request on github - javascript

Is there a way so that whenever a pull request is created on github, a new pull request is automatically created after running some npm command (ex. npm run beautify) so that I don't have to worry about the beautification process.
If any such thing can be done which automatically adds a commit to the current pull request which beautifies all the files, even that works fine.
I am ok with using any free third party softwares (Greenkeeper, travis or whatever)

You can use a git hook both on server and local or set up local filters (smudge/clean) to beautify your code before it even being committed to the repo.
Git hooks
Read the official docs for a full reference.
Smudge / clean
Read all about it and to set it up here:
https://git-scm.com/book/en/v2/Customizing-Git-Git-Attributes
It turns out that you can write your own filters for doing substitutions in files on commit/checkout.
These are called clean and smudge filters.
In the .gitattributes file, you can set a filter for particular paths and then set up scripts that will process files just before they’re checked out (“smudge”, see Figure below) and just before they’re staged (“clean”, see Figure 8-3).
These filters can be set to do all sorts of fun things.

Related

What's a good way to include an npm module in git

Kind of a noob question here...
We've got a private npm module - a library - that needs to be included in other projects. So far, very simple.
Currently, we're simply "remembering" to manually do an npm run buld before pushing changes to our git repo, and then dependent projects when they do an npm run whatever, they're setup to pull from our repo and use the latest version already "compiled" as a module.
So, there are issues with this approach:
It relies on humans being able to perfectly remember to do a build before pushing to origin. (inherently fragile).
VSCode constantly shows me the build-artifacts as if they were source files. Git similarly shows merge conflicts relating to those files - which -- really, aren't source at all. They're compilation artifacts, but I'm not sure I want to .gitignore them - because - well, the point of all of this is to create those artifacts for use in other projects... so they belong in the repo, just not as source files...
So I'm not sure how to untangle this mess.
I want:
A simple way to update the source that doesn't cause git to become upset about merge conflicts for build artifacts, but only for actual source files
A simple way to ensure that the build artifacts are always updated upon push to origin (in fact, I'd prefer that it build & run our mocha tests and refuse to do a push if that fails)
I'm only about 9mos into using git on github - so there's a ton I don't know...
Ideas for better ways to manage this / automate this - are most welcome!
The key to implementation is of course simplicity. If it's easy to do, I'm sure I'll do it, and can get others to do so. But if it's a huge hurdle every time, well, we all know how well that goes over for other devs...

Is it possible to get a git tree like ls-files but remotely?

My goal is to get all the markdown files of a git Server and to display them as a kind of documentation platform for the project.
Is it possible to get a tree of all currently committed files of a git repository using command line?
Or is there any other possible option to get all markdown files including their path from a git repository?
(The main reason is a bonobo git server... if nothing else helps something platform specific is ok. But the goal is to make it work with every git)
(It would be even better if there is a JavaScript option to do that)

How to make sure javascript and css is cached in Angular app

I am reasonably new to angular (5), and have noticed that the javascript files (vendor.bundle, main.bundle, etc) are being reloaded each time I visit a page.
Is there anything in particular I should be doing to make sure that these are held in a browser cache after the first time they are loaded?
I guess I would need to add a cache-control header, but am not sure where to put it in the code, or whether this is something that the Angular-Cli could generate
Angular have lib called Service workers, which simply can be installed in cli project by below cli command
ng add #angular/pwa --project *project-name*
Note: project name can be obtained from angular.json
This command do the most required configuration but still some other stuff is needed, Which can be found on the flowing link service-worker confi. but some of this configuration already done by previous mentioned command. but also more configuration may be needed in "ngsw-config.json" file.
But unfortunately i tested this inside spring war and still the big files still downloaded every time without any caching but if i deployed on http server direct it work perfect.
Inside Spring War Result
For More Info. Please Check the blob of Angular Service Worker - Step-By-Step Guide for turning your Application into a PWA

Overwritting or changing package.json "homepage" value

I'm currently trying to overwrite or change a value in my package.json from another file. Basically, package.json has a "homepage" value that gets built when I run npm run build. I wish to be able to change that value from my config.js or config.production.json files. I want my environment values all in the config files so it is easier to modify. However, when I run npm run build, it still loads my homepage value from the package.json.
package.json
{
"homepage": "/company/portal"
}
config.production.json
{
"configPath": "/newCompany/portal"
}
Thank you for your help
If you mean in general how to write a file in the client machine through a script in the browser, it isn't a thing allowed so easily and you will have also a lot of cross browsers issues implementing it by 0.
You could try to take a look to this library which seems quite good:
https://eligrey.com/demos/FileSaver.js/
You can also think to start an AJAX request to a node.js application for example which will write you the file easily on your system or provide a download, or in general to server side which will provide a file to be downloaded to the client.
But, from the case you explained, you just need to change the config file in your system, so considering you are using node.js, the easiest way is using node.js
It is usually strongly discouraged to put your env variables values inside a JSON file. It can seem that you keep things in order but most probably your code will be pushed somewhere and so opening the JSON file, anyone can see all your values of the env variables. And this is not a good thing.
In my opinion you should think to write your build script in order to take arguments when called, and then call the build passing the parameters. For example:
npm build --production
npm build --development
Depending on the parameters, you will set up the right configuration on the fly.
I hope this helps

Bundler for javascript, or how to source control external javascript files

I am in the process of converting an existing Rails 3.1 app I made for a client into a Backbone.js app with the Rails app only as a backend server extension. This is only a personal project of mine, to learn more about Backbone.js.
While setting up Backbone.js (using Backbone-on-Rails), I noticed I have some dependencies (like backbone-forms) that come from external sources and are frequently updated.
I've grown accustomed to using Bundler to manage my Ruby gems, but I haven't found anything similar for JavaScript files. I'm wondering if there is any way to do the same for Javascript (and possibly css) files.
Basically I can see three possibilities to solve this issue:
Simply write down all the sources for each JS file and check these sources from time to time to see what has changed.
Use some kind of existing "Bundler for Javascript" type of tool, I've been looking for something like this but have yet to find anything (good).
Since most of these JS files will be coming from Git anyway, use Git to get the files directly and use checkout to get the latest version from time to time.
I prefer the last option, but was hoping on some more input from other people who have gone this route or preferred some other way to tackle this issue (or is this even an issue?).
I figure the Git way seems easy, but I am not quite sure yet how I could make this work nicely with Rails 3.1 and Sprockets. I guess I'd try to checkout a single file using Git and have it be cloned in a directory that is accessible to Sprockets, but I haven't tried this yet.
Any thoughts?
You don't mention it in your alternatives, but ideally you should use something like Maven to manage your dependencies. Unfortunately, there are no public repositories for javascript files. This discussion lists some other options which might be of help to you: JQuery Availability on Maven Repositories
For now I've settled on using the Git solution combined with some guard-shell magic.
The steps I follow:
Create a dependencies directory somewhere on your local drive
Clone the repositories with javascript (or css) files you want to use in the app
Set up a custom guard-shell command to do the following:
group 'dependencies' do
guard 'shell' do
dependencies = '~/path/to/dependencies/'
watch(%r{backbone-forms/src/(backbone\-forms\.js)}) {|m| `cp #{dependencies + m[0]} vendor/assets/javascripts/#{m[1]}` }
end
end
Place the Guardfile at the root of the app directory
It takes some time to set things up, but after that, when you have the Guard running, and you pull changes into your dependencies, the required files are automatically copied to your application directory, which are then part of your repository.
It seems to work great, you need to do some work for each new file you want to include in the asset pipeline, but all that is required is cloning the repository in your dependencies directory and adding a single line to your Guardfile, for example for the backbone-form css:
watch(%r{backbone-forms/src/(backbone\-forms\.css)}) {|m| `cp #{dependencies + m[0]} vendor/assets/stylesheets/#{m[1]}` }
Also, the reason I added this Guard to a group is because I keep my dependencies outside the main application directory, which means guard normally doesn't check my dependencies directory. To make this work, I start up my main Guard processes using bundle exec guard -g main and use bundle exec guard -w ~/path/to/dependencies -g dependencies in a new terminal window/tab to specify the -w(atchdir).

Categories

Resources