angular app, run gradle task with npm run build - angularjs

I have an angular 1 app. Every time I run
npm run build
I also want to start a gradle task. Can I automatize that somehow?

Of course you can, the command npm run build run the script defined in you package.json file.
It looks like this :
"scripts": {
"build": "myAwesomeCommand; gradle myTask"
},
You can change the command executed by npm run build. If your command is too long or if you need a script, you can also create a shell script in your current directory and execute it.

The idea of using Gradle is that it automates the commands. Thus, you can use some construction of that type (in your build.gradle file):
task someGradleTask {
// ... Do something
}
task someNpmTask(type: NpmTask) {
args = ['run', 'build']
}
And then make one of the tasks dependant on the other:
someGradleTask.dependsOn(someNpmTask)
// Moreover
someNpmTask.dependsOn(npm_install) // This task comes with the plugin below
You will need an NPM plugin for Gradle, which may be included like this:
buildscript {
dependencies {
classpath "com.moowork.gradle:gradle-node-plugin:1.2.0"
}
}
apply plugin: 'com.moowork.node'

Related

Where does React put the continuous build files when using create-react-app

I'm using create-react-app. When I run npm start (react-scripts start) it continuously builds the changes for me and does it magic. But what is the output folder for that? I know when I build it manually where the files go.
I want to use firebase emulator to serve the current version (the continuous build) of my react all but I don't understand where's the output folder or how to achieve it.
You could try this package https://github.com/Nargonath/cra-build-watch
Install it and add the script to your package.json
{
"scripts": {
"watch": "cra-build-watch"
}
}
and run it
npm run watch
more info here
https://ibraheem.ca/writings/cra-write-to-disk-in-dev/
and if you go to the react repo issue linked in the article you would find more workarounds
tl;dr
run npm run build, not npm run start
More Detail
react-scripts start runs webpack-dev-server internally. As a default setting, webpack-dev-server serves bundled files from memory and does not write files in directory.
If you want to write files with webpack-dev-sever, you could set writeToDisk option to true in your dev server configuration.
However, I dont think this is what you want to serve on firebase emulator. Webpack-dev-server does not build optimal app for production, and you also need to use react-app-rewired to customize dev server configuration in cra template.
What you want to do is npm run build to run react-scripts build, which builds optimized production app in /build directory.

How do I install npm dependencies to build a reactjs app using VSTS?

I am trying to build a reactjs using vsts (visual studio team services). I have a very simple pipeline outlined below. Everytime I run Build it fails. It fails because it cannot find the node_modules folder. It seems they are being installed at the wrong directory location.
How can I install the node modules at the correct location? It seems to me that I need to CD into the folder after the get source command but I cannot figure out how to do change directory before the npm install command is ran.
Here is my pipeline:
get source
install dependencies
build
zip the build
Like this in vsts:
The second step Install Dependencies, which reads the package.json file and installs the node_modules, does not place the node_modules in the correct location, this causes my next step, build, to fail.
The build error says this:
I can run this manually
To run this manually using VS Code and git I run the following commands and it works every time. Here are the commands and the output.
Open working folder:
git init
git clone [web url to package here]
ls
d----- 8/30/2018 10: 56 AM CairsWebClient
cd CairsWebClient
npm install
npm start
Runs perfect.
Here are the details of the install command in vsts:
I have tried adding the following to the package.json location field. It always fails.
./CairsWebClient - Fail
/CairsWebClient - Fail cannot find C:\CairsWebClient
CairsWebClient - Error: ENOENT: no such file or directory, stat 'D:\a\1\s\CairsWebClient'
You need to specify the folder path of your project's package.json in Working folder with package.json input box, otherwise, it will uses current process's working folder.

npm test does not detect new test file changes in jenkins

Jenkins/jest and CI ,
I have created a react APP using create-react-app and I use JEST for testing and I did some new changes in a file created app.test.js and committed to git-hub- hooked it with jenkins -when I run npm test in the local machine the tests are run fine and they all pass ..
BUT when i run the jenkins pipeline script it says the following :
No tests found related to files changed since last commit.
Press a to run all tests, or run Jest with --watchAll.
Watch Usage
› Press a to run all tests.
› Press p to filter by a filename regex pattern.
› Press q to quit watch mode.
› Press Enter to trigger a test run.
I have tried changing app.test.js -created a new file commit changes and then created a new pipeline in jenkins and tried again ( I have also tried these discussed here :https://github.com/facebookincubator/create-react-app/issues/930) but I still get the above error : my pipeline script is shown below:
node{
stage "CI"
git 'https://github.com/NaveenDK/mentalshortcuts.git'
bat "npm install"
stage " Unit testing"
bat "npm test"
}
def notify(status){
emailext (
to: "dd#dd.com",
subject: "${status}: Job '${env.JOB_NAME} [${env.BUILD_NUMBER}]'",
body: """<p>${status}: Job '${env.JOB_NAME} [${env.BUILD_NUMBER}]':</p>
<p>Check console output at <a href='${env.BUILD_URL}'>${env.JOB_NAME} [${env.BUILD_NUMBER}]</a></p>""",
)
}
node {
notify("Deploy to staging?")
}
input 'Deploy to Staging?'
node {
bat "npm run-script build"
}
Any help any links anything at all would be great!
The tests did not run on jenkins as Jenkins was running on Windows, and Windows doesn't support glob, which is src/**/*.js.
this problem was not encountered when the project was build on Jenkins that was installed on a Linux OS!
I also faced the same issue. As mentioned above by Naveen, Windows doesn't support glob, which is src/**/*.js.
That's why in Jenkins configuration, change the label to Linux. Check here to see a preview.
Jenkins configuration
And then in the build section, add the following line as shell commands:
npm install
npm run build
CI=true npm test
Always run npm install first. It will install all the packages.
Then run npm run build to build the app
In the end, make sure to write CI=true npm test. It will run test cases only once. If you write npm test instead, then it will run the test and go into watch mode forever.
I hope this helps.
I encounter this problem on my local machine like this,
"test": "jest --watchAll"

gradle not passing args to gulp with extended use options

Using the following Gradle gulp plugin which simply executes the gulp task from a gradle task via a simple naming convention gulp_<task name>
In the extended options on the docs : Gradle gulp plugin extended docs it demonstrates the following:
task gulpBuildWithOpts(type: GulpTask) {
args = ["build", "arg1", "arg2"]
}
In my standard build task executed by gradle like so:
// runs "gulp build" as part of your gradle build
bootRepackage.dependsOn gulpBuildWithOpts
task gulpBuildWithOpts(type: GulpTask) {
args = ["build", "--env prod", "--buildType gradle"]
}
The following is executed and built, however the args are ignored, gulp never picks them up. The args should be handled by Yargs command line parser
If I run direct with gulp (like below) then this works fine, so why am I getting my args ignored when ran from gradle?
gulp build --env dev --buildType gulp
NOTE - App layout is Springboot / AngularJS (^1.5) if you're wondering about choice of tooling.
You need to pass those options in separately:
task gulpBuildWithOpts(type: GulpTask) {
args = ["build", "--env", "prod", "--buildType", "gradle"]
}
Otherwise "--env prod" is interpreted by yargs as a single option named env prod, instead of an option named env with an argument of prod.

Separating a Build and Test on Jenkins

I have a angular application which i develop using source control ofcourse (gitlab), I recently integrated it with jenkins so that everytime i push to my git it triggers a build. In my jenkins i created a job that pretty much builds the application (installs dependencies) and runs test. Following is what my execute shell looks like in my job.
export npm_config_prefix=.npm/
export PATH=.npm/bin:$PATH
npm install -g bower grunt-cli
npm install
bower install
gulp test
Now the issue is that I do not want to build and run test as a same step i want them to seprate. So how do i achieve this ? Do i create a new job and add gulp test in the execute shell of the new job ? Or is there some other approach. I am new to jenkins and CI in general so was wondering what would be the approach in this situation ?
As you have found, Jenkins is a super advanced shell script runner to take the boring part out of repeatable steps in the build process.
The next step is to hunt down plugins to do those steps for you in a cleaner way. This is where plugins come in
These is a Node Plugin which will install npm packages outside the job so you don't have to do the npm install -g step every single job
You would want to keep the build step as shell
npm install
bower install
gulp test
I think that is your concern because you only need to run the job if the code has changed, including local dependencies. You could add a second shell step and just have the tests in there as it will run in the same workspace but all the build logs will be in one place
You didn't say what test runner your using but you will probably find a publisher step which will bring that into Jenkins for you xUnit plugin covers quite a few runners so might work for you
And this is the tutorial on installing plugins into Jenkins

Resources