I'm trying to set up a build environment to explore react.
My build process uses gulp.
I installed packages like this:
npm install --save-dev gulp-babel#7 babel-core babel-preset-env
After discovering that I needed to install something related to babel and react I also ran:
npm install --save-dev #babel/preset-react
My .babelrc has this:
{ "presets": ["#babel/preset-react"] }
My gulpfile has this:
gulp.task('scripts', function() {
return gulp.src(['./src/js/main.js' ])
.pipe(babel({
presets : ['#babel/preset/react']
}))
.pipe(concat('test.js'))
.pipe(gulp.dest('./js'))
.pipe(uglify())
.pipe(rename('test.min.js'))
.pipe(gulp.dest('./js')) ;
});
When I run 'gulp scripts' I get this:
[22:51:14] Using gulpfile ~/play/learning-react-2/gulpfile.js
[22:51:14] Starting 'scripts'...
[22:51:14] 'scripts' errored after 59 ms
[22:51:14] Error in plugin "gulp-babel"
Message:
Cannot find module '#babel/core' (While processing preset: "/home/bob/play/learning-react-2/node_modules/#babel/preset-react/lib/index.js")
I deleted babel-core from node_modules, and reinstalled it using the command:
npm install --save-dev #babel/core
If I look at the contents of node_modules, I see these packages related to babel:
babel-code-frame/
babel-helper-builder-binary-assignment-operator-visitor/
babel-helper-call-delegate/
babel-helper-define-map/
babel-helper-explode-assignable-expression/
babel-helper-function-name/
babel-helper-get-function-arity/
babel-helper-hoist-variables/
babel-helper-optimise-call-expression/
babel-helper-regex/
babel-helper-remap-async-to-generator/
babel-helper-replace-supers/
babel-messages/
babel-plugin-check-es2015-constants/
babel-plugin-syntax-async-functions/
babel-plugin-syntax-exponentiation-operator/
babel-plugin-syntax-trailing-function-commas/
babel-plugin-transform-async-to-generator/
babel-plugin-transform-es2015-arrow-functions/
babel-plugin-transform-es2015-block-scoped-functions/
babel-plugin-transform-es2015-block-scoping/
babel-plugin-transform-es2015-classes/
babel-plugin-transform-es2015-computed-properties/
babel-plugin-transform-es2015-destructuring/
babel-plugin-transform-es2015-duplicate-keys/
babel-plugin-transform-es2015-for-of/
babel-plugin-transform-es2015-function-name/
babel-plugin-transform-es2015-literals/
babel-plugin-transform-es2015-modules-amd/
babel-plugin-transform-es2015-modules-commonjs/
babel-plugin-transform-es2015-modules-systemjs/
babel-plugin-transform-es2015-modules-umd/
babel-plugin-transform-es2015-object-super/
babel-plugin-transform-es2015-parameters/
babel-plugin-transform-es2015-shorthand-properties/
babel-plugin-transform-es2015-spread/
babel-plugin-transform-es2015-sticky-regex/
babel-plugin-transform-es2015-template-literals/
babel-plugin-transform-es2015-typeof-symbol/
babel-plugin-transform-es2015-unicode-regex/
babel-plugin-transform-exponentiation-operator/
babel-plugin-transform-regenerator/
babel-plugin-transform-strict-mode/
babel-preset-env/
babel-runtime/
babel-template/
babel-traverse/
babel-types/
I'm guessing that at least one of them is "babel core"
So... how do I actually run babel from gulp? How do I run it at all?
I had the same issue. I resolved it by removing node_modules and I reinstalled packages (with yarn OR npm install). The problem was fixed.
In case Victor's answer doesn't help, it may be worth a try to clean your machine's package cache by running npm cache clean/yarn cache clean or removing the cache folder manually.
I would like to install bootstrap-loader from github in my project using npm
Currently they are maintaining two version of this project which are comaptible with webpack version 1 and 2.
I would like to install version 1. What npm command I should use to install this?
I tried using below one but it is not working.
npm install git://github.com/shakacode/bootstrap-loader.git[#v1] --Save
There are extra square brackets in the command you tried.
To install the latest version from the brach-name branch, you can use:
npm install "https://github.com/shakacode/bootstrap-loader.git#branch-name" --save
npm: npm install username/repo#branchName --save
yarn: yarn add username/repo#branchName
e.g. npm i betimer/rtc-attach#master --save (my username is betimer)
// this will appear in your package.json:
"rtc-attach": "github:betimer/rtc-attach#master"
One thing I also want to mention: it's not a good idea to check in the package.json for the build server auto pull the change. Instead, put the npm i (first command) into the build command, and let server just install and replace the package.
One more note, if the package.json private is set to true, may impact sometimes.
you can give git pattern as version, yarn and npm are clever enough to resolve from a git repo.
yarn add any-package#user-name/repo-name#branch-name
or for npm
npm install --save any-package#user-name/repo-name#branch-name
Another approach would be to add the following line to package.json dependencies:
"package-name": "user/repo#branch"
For example:
"dependencies": {
... other dependencies ...
"react-native": "facebook/react-native#master"
}
And then do npm install or yarn install
I'm using SSH to authenticate my GitHub account and have a couple dependencies in my project installed as follows:
"dependencies": {
"<dependency name>": "git+ssh://git#github.com/<github username>/<repository name>.git#<release version | branch>"
}
Had to put the url in quotes for it work
npm install "https://github.com/shakacode/bootstrap-loader.git#v1" --save
Tried suggested answers, but got it working only with this prefix approach:
npm i github:user/repo.git#version --save -D
Only solution working for me:
$ npm i https://github.com/{USER}/{REPO}/tarball/{BRANCH} --save
as explained here.
Both below versions work for me as of beginning of 2023:
npm i "github:shakacode#bootstrap-loader"
npm i "https://github.com/shakacode/tree/bootstrap-loader/"
The Doc of the npm defines that only tag/version can be specified after repo_url.
Here is the Doc: https://docs.npmjs.com/cli/install
I followed the instructions to install Facebook jest on https://facebook.github.io/jest/docs/getting-started.html#content :
npm install --save-dev jest-cli
After the install command I typed jest in the terminal, and press enter but It popped:
bash: jest: command not found.
But when I run the getting started sample by using npm test in the terminal, it worked well.
So, how can I verify that Facebook jest is installed successfully?
Ways to install a package in npm
In node.js you have two ways to install a package: globally or locally.
The sintax is the following:
// globally
npm install -g [package_name]
// locally
npm install --save-dev [package_name]
So, now what it happens is that you run the local one which downloads the package in node_modules under your project folder.
To check you installed jest properly so you can check on your node_modules if there is a jest folder.
How to check if jest is installed
In addition to that npm is creating a shortcut in you local node_modules under the directory .bin son in there you should find a link to jest.
You can test that like that:
cd your_project_folder
./node_modules/.bin/jest
Why npm test works?
The reason why npm test works is because when you run it npm is going to look for the commands globally and locally.
I'm an ember-cli newbie and I'm trying to start testing my dumb app with some dumb tests. It seems that ember-cli ignores any *test.js.coffee files in tests directory.
I'm using version 0.0.44 and installed coffescript adapter with npm install --save-dev ember-cli-coffeescript
Any idea why?
Did you install the coffeescript module?
npm install --save-dev ember-cli-coffeescript
I have installed Nodejs.
But I want to install Karma manully for some reason.
And there is no instruction in Karma's home page http://karma-runner.github.io/0.10/index.html
This installs karma globally:
npm install -g karma