Is it possible for Azure DevOps to update part of my code when release kicks in?
For example, I have a setting file inside my react app. This setting file has export const ISPROD = false in it. I need Azure DevOps to change this false value to true before it builds the react app and deploys it. Is that possible?
Note: My Server build is Linux.
You could update your code in your javascript files using the "Replace Tokens" task e.g.
- task: replacetokens#3
inputs:
targetFiles: "yourJavascriptFile.js"
encoding: "auto"
writeBOM: true
verbosity: "detailed"
actionOnMissing: "warn"
keepToken: false
tokenPrefix: "#{"
tokenSuffix: "}#"
displayName: Perform variable substitution in javascript file file
You'd add this task before the task you use to build your application.
In your javascript file you would write the variables to be replaced as e.g.
export const ISPROD = #{IS_PROD}#
This task when run would then replace "#{IS_PROD}#" with your Azure Devops variable named "IS_PROD" with it's value set as true.
Since you're on linux you can just add the bash task or shell script task to your build and add an inline script or path to a script in your repo that does the setting update.
You'll need to take a look at the available environment variables in your pipeline that you can use in your script to access the working directory of your code.
You can optionally specify conditions under which the task runs. For example, I do something very similar when versioning our components for release, which are only done during builds triggered by a git tag.
Here's a free Visual Studio Marketplace Pipeline task that will do the trick: Replace Text in Source Files
This one will also work: RegexReplace Build Task
If you want to make a custom solution following might help full to you
Go with Bash Task in azure pipeline
In Yaml steps define inline Ex:
steps:
task: Bash#ReplaceTextInFile
inputs:
targetType: 'inline'
script: bashscript
use sed command to replace text in your file.
Related
this is my first time im trying to handle " Web api ", so i took this project to get many call but after it running well, when i try to click to "search" it dosent work,
I guess the problem arises from api call because chrome inspector show me that :
I was able to understand on the different forums, for handling apis call with Node.js that must be encapsulated API calls behind "Environment variable".
That the config.js file
When i try to put on the terminal export env.API_KEY='000000000000000' it made me :
export: not valid in this context: env.API_KEY
I hope you can point me in the right direction, I very tried everything, to run it that.
I personally like to use a npm package called dotenv:
You can install it by running npm i dotenv within your api directory.
Have a file called .env within your api directory which contains all of your environment variables:
APP_ID="000000000000000"
API_KEY="000000000000000"
Then change config.js to load all environment variable files when it is executed by including require('dotenv').config():
require('dotenv').config()
module.exports = {
APP_ID: process.env.APP_ID,
API_KEY: process.env.API_KEY,
BASE_URL: 'https://api.adzuna.com/v1/api/jobs',
BASE_PARAMS: 'search/1?&results_per_page=20&content-type=application/json',
};
Note: you will also want to add .env to your .gitingore so that your sensitive API keys aren't included in your git repository
I have an index.html and I need to pass some sensitive information to some JavaScript variables. This index.html contains plain javascript with jquery
so I am settning environmental variable like this:
USERNAME="123"
PASSWORD="password"
And I need to access this using javascript
<script>
var username = process.env.USERNAME;
var pw = process.env.PASSWORD;
</script>
but this gives the error
Uncaught ReferenceError: process is not defined
Maybe this is because I am using vanilla javascript. And I can't use any other framework other than jquery
Can someone help me how to do this?
I had this exact issue to deal with and I was able to create a working solution using this article. For this answer, I'll summarise the steps I took for a project deployed to Netlify and already modified to fit your question, but you can check out the article to see the base example and also learn more.
Note: This solution is ideal for small personal projects where the information is not exactly sensitive but you just don't want them
displayed so visibly in your code. Do not use for larger projects that require a reasonable level of security measures.
If your project is already deployed to Netlify, or a similar platform where you can add build/deploy commands:
Go to the build settings
If the script file you want to use the variables for is in a folder, set the build command to this: cd DIRECTORY-FOR-THE-SCRIPT-FILE && echo -e "export const USERNAME="123";\nexport const PASSWORD="password";" > config.js
If the script is in your root folder, set the command to this echo -e "export const USERNAME="123";\nexport const PASSWORD="password"; > config.js
In your index.html file where you import the script, set your script tag to include this attribute type="module" i.e <script src="./index.js" type="module"></script>
In your script file, import the variables by adding this line to the file: import {USERNAME, PASSWORD} from "./config.js"
Trigger a redeploy manually on Netlify, or it will be deployed automatically if you already set automatic deploys for the repo.
That's all!
This solved mine and I hope it helps anyone else✨.
So what is your environment? javascript runs in the frontend, where are you setting the env variable?
You may be able to use something like fs - https://www.npmjs.com/package/file-system to read from a file on the operating system, but I would not imagine most browsers would allow this
I'm not looking for a full working solution for my question, but for a recommendation on how to achieve something.
I have a web application with a javascript file which contains some constants and default values.
I'm using ant to build and package the application, so I have 2 targets, one for development and another one for production. The thing is, in my configuration file some constants have a default value for production but another one in development.
Right now, if I'm developing and I want to prepare a delivery for production I have to:
- manually edit configuration file to set right values (comment some lines and uncomment some others)
- run ant production target
I'd like to automate this, so when I run my ant target for production, the correct default values are used in my configuration javascript file. Can ant achieve this (search for some lines in a javascript file and edit that file)? is this a bad practice? any other way to do this?
As a suggestion, I would have two configuration files -dev and -prod and then use ant to move the right file to the build dir, renaming it if needed
You can write to a file using the echo task
https://ant.apache.org/manual/Tasks/echo.html
Replace Task is a directory based task for replacing the occurrence of a given string with another string in selected file.
https://ant.apache.org/manual/Tasks/replace.html
I'm going to start tagging a codebase using Git tags, but I would also like to display this tag somewhere within my app, so that the testers know which version they are testing.
Is there a way to read what the current Git tag using JavaScript?
FYI, I use Grunt.js to build the app. However, a vanilla JS solution would preferable.
isomorphic-git has a listTags() function that does just that. The package is available as a npm package. Example snippet copied from the API documentation:
let tags = await git.listTags({ dir: '.' })
console.log(tags)
Currently, isomorphic-git does not support creating tags (at the time of writing, the latest release of the package is version 0.37.3). However, there is a GitHub issue implying that the work has been started and it will be added in the future.
Using the git-rev-sync package, you can create a custom task to retrieve the current tag and store it as a grunt.option to use elsewhere in your grunt tasks:
var git = require('git-rev-sync');
function currentGitTag() {
var currentTag = git.tag();
grunt.option('tag', currentTag);
}
grunt.registerTask('gitTag', currentGitTag);
To access the value within grunt: grunt.option('tag');.
You can also access the value via template strings: <%= grunt.option('tag') %>
The documentation explains how to generates jsbindings, but it does not tell the proper way to integrate it into a project. What steps do I must follow? Where should I store my manually written C++ files? Where should I store the generated js and c++ files? What CMakeList.txt files should I edit?
I believe I found some way to do this.
Please confirm me I don't do anything wrong (I copied this message on the official forum).
Let's integrate the js-bindings test samples in a cocos2d-js project.
First generate the tests : cd tools/bindings-generator/test && ./test.sh && cd ../../.. (that may need some configuration). At the moment it fails on Linux because of missing headers but I submited a merge request.
Copy files into the project
cp -R tools/bindings-generator/test/simple_test/ frameworks/runtime-src/Classes
cp -R tools/bindings-generator/test/simple_test_bindings/ frameworks/runtime-src/Classes
Update CMakeLists.txt and frameworks/runtime-src/proj.android/jni/Android.mk and add the added files autogentestbindings.cpp and simple_class.cpp to the target lists.
Register the jsb functions in the runtime sources in frameworks/runtime-src/Classes/AppDelegate.cpp by adding sc->addRegisterCallback(register_all_autogentestbindings); in AppDelegate::applicationDidFinishLaunching
Then classes defined in simple_class.h are available in Javascript. The following JS code should display 1337.
console.log((new SimpleNativeClass(1337)).getSomeField())