I am not familiar in jspm and its registry. I have a private source in bitbucket and I need to create a registry for this in jspm. I am using nodejs with gulp task runner in my source. I researched the jspm doc and there is no information for bitbucket.
I have used the below config in my package.json
"devDependencies": {
.....
"jspm": "^0.16.39",
"jspm-git": "^0.4.5"
}
"jspm": {
"registry": "jspm",
"name": "my-package",
"registries": {
"bitbucket": {
"baseurl": "git+ssh://git#bitbucket.org/",
"handler": "jspm-git"
}
}
}
Is it enough for creating a registry in jspm?
How to use bitbucket repository in jspm registry and how to install it?
Is there any doc or steps available in online?
Execute the command:
jspm registry create bitbucket jspm-git
When it asks for the url set the base one:
ssh://git#bitbucket.org
No need to set the advanced configurations. It will use the system ssh public key to authenticate with bitbucket.
To add your repository into the package.json simply add:
"new-component": "bitbucket:gguridi/repository#master",
Executing jspm install should retrieve the code.
Related
I am currently supporting an application that is built using AngluarJS Version 1. I am quite new to this.
I have a task to integrate the Azure Application Insights into this application. The below reference link gives info about the integration using npm
https://learn.microsoft.com/en-us/azure/azure-monitor/app/javascript
I am not sure how to write the below code in AngularJS, this gives the error.
import { ApplicationInsights } from '#microsoft/applicationinsights-web'
Please help or if there are any references please share.
Either we can use NPM Setup and Snippet Setup.
For NPM
npm i --save #microsoft/applicationinsights-web
Configure Angular APP and Include Dependencies
You can use the environment.ts file to store the Instrumentation Key
export const environment =
{
. . .
appInsights: { instrumentationKey: '<Your Instrumentation Key>'
}
};
Add Dependency to package.json Restore it using npm install
"dependencies": { "#microsoft/applicationinsights-web": "~2.4.4",
...
}
Refer here for further steps
How can transform my react project into script to connect it to html page?
I am a new one in react please be tolerant. My boss demands to get completed script to connect it to html page without node and etc. What shall I do? Thank you.
Please check this url:
https://blog.bitsrc.io/react-production-deployment-part-3-heroku-316319744885
Also, Please check these steps:
In package.json, added this line to the scripts
"heroku-postbuild":
"NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run
build --prefix client".
Then added this
"engines": { "node" : "[your node version]" } after scripts.
In index.js, put the following code after your routes set up
if (process.env.NODE_ENV === "production") {
app.use(express.static("client/build"));
const path = require("path");
app.get("*", (req, res) => {
res.sendFile(path.resolve(__dirname, "client", "build",
"index.html"));
});
}
I assume that you use git for version control and already install Heroku.
Open your terminal, then Heroku login -> Heroku create -> git push Heroku
master. If you do not get any error, you are a success to deploy your app.
Hope you will get it to work.
In order to get rid of node, you need to first build your project. If you've initialized your project with create-react-app, run this command:
npm run build
A folder named 'build' will appear in your project root containing your production app. Now the build folder is ready to build and you can serve it with a static server like 'serve'. To install 'serve' via npm, do this:
npm install -g serve
that's it! you can serve it now:
serve -s build
You can find out more about deployment here:
https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#deployment
by using create-react-app
https://create-react-app.dev/docs/getting-started
https://create-react-app.dev/docs/deployment
dev: npm start or yarn start.
prod: npm run build or yarn build.
I have a working application consisting multiple components created using create-react-app, each component is a separate app in itself again created using create-react-app.
All the components are ejected so that I could integrate it together.
Now, I want to publish the components to NPM/Private repository but as per CRA deployment guide, it doesn’t support publishing of CRA based components directly out of the box, it suggests using nwb, but I couldn’t figure out how to use nwb to publish ‘existing’ components.
I have also looked at the one of the medium post where it suggests using the babel-cli to generate the dist/build files but that’s failing for some babel configuration which works well otherwise.(sorry, don’t have link at the moment as I am posting this from cellphone).
Any help is appreciated.
You can do it by using babel-cli npm package which will compile your react application code and then you can publish it using npm publish command, the detailed steps are as follows.
Install the babel-cli package in your create-react-app using npm install babel-cli command.
Create .babelrc file and add following contents to use "react-app" preset provided by babel.
{
"presets": [["react-app"]],
}
Add distribute command in package.json using following code, this command compiles the code from src folder to dist folder. Generally, I do not include my test files in published library so the --ignore argument skips the tests files like *spec.js and *test.js, this argument is optional and you can remove --ignore spec.js,test.js if you would like to include test files in your published library. The --source-maps argument includes the source maps for the included source files :
"distribute": "set NODE_ENV=production&&babel src --out-dir dist --copy-files --ignore spec.js,test.js --source-maps"
Execute the command npm run distribute which will generate the files in dist folder.
Set private: false in package.json to make available for publish
Set main file of your distributed package using following command, in my case I directly use App.js
"main": "dist/App.js"
Add following code for publishing the package and provide repository related details
"publishConfig": {
"registry": ""
}
You can use npm run publish command to distribute your react app source code as library.
I'm using lite server for developing my Angular projects. It depends on and uses BrowserSync to do most of the work (serving the site to localhost, live reload etc).
Currently, I have a config file bs-config.json in my root for this module:
{
"injectChanges": true,
"files": ["./**/*.{html,css,js,png,jpg,svg,gif}"],
"watchOptions": {
"ignored": [
"node_modules",
"src/**/*.*",
"app/**/*.js"
]
}
}
Then in my package.json I have a script to execute it, referring to the config file:
{
"version": "1.0.0",
"scripts": {
"dev": "lite-server -c bs-config.json"
},
"devDependencies": {
"lite-server": "~2.2.0"
}
}
Works great. But ideally I don't want a config file in the root of my project that isn't used in production. Is it possibly to extend the script in my package.json to execute the config inline with the command?
Unfortunately, its not possible to extend the dev script in your package.json to execute the config inline when using lite-server.
If you don't want a config file in the root of your project, you would simply place it elsewhere in your project (i.e., in a folder called configs) and provide a custom path to your config file via -c or --config run time options. So your dev script will be "lite-server -c configs/bs-config.json".
Check out this GitHub issue: Command line arguments no longer supported?
In my app is using froala/angular-froala plugin which requires froala/wysiwyg-editor plugin.
So I've included all as usual, but I need change version from 1.2.6 to latest commit from master branch, and I do so:
"overrides": {
"angular-froala": {
"main": [
"src/angular-froala.js",
"src/froala-sanitize.js"
],
"dependencies": {
"FroalaWysiwygEditor": "master",
"angular": "~1.2.22"
}
},
"FroalaWysiwygEditor": {
"version": "master",
"main": [
"css/froala_editor.min.css",
]
}
}
but why it didn't work? Why it is still using 1.2.6 (latest release version)? How to specify to use latest commit and override?
Update: Why do you need to change the version of a dependency's dependency? In this case froala/angular-froala's has defined its own dependencies, since it needs those to build.
If you change the dependencies of a package, you do not own, you might actually break the build process. Instead of trying to override this, you can do 2 things:
Propose an change to froala to update their bower.json on the master branch - very unlikely.
Fork froala/angular-froala, update the dependencies in the bower.json and add your fork as a dependency of your current project.
Get the latest version for a dependency
To get the latest commit from a specific branch or commit via bower, use a dependency like this where the string after the hashtag is either the branch name or the git commits SHA:
"dependencies": {
...
"angular-froala": "git://github.com/froala/angular-froala.git#master"
...
}
You can also install it that way:
bower install --save git://github.com/froala/angular-froala.git#master