how do I install node, npm, angular cli on MAC? - node.js
I've been trying to install the angular cli for several days now with now luck. I've tried installing node manually, and with brew. I've uninstalled node and reinstalled. I've also tried fixing the npm permission with steps found here: https://docs.npmjs.com/getting-started/fixing-npm-permissions
I've checked that all the appropriate directories have correct permissions. I do think it odd that even when uninstalling and reinstalling the npm config prefix is
'/Users/myusername/.npm-packages' instead of '/usr/local'.
Any help on how to get this installed correctly would be appreciated!
I'm running macOS Sierra 10.12.6.
node -v = v8.9.0
npm -v = 5.5.1
When trying to run 'ng version' I get '-bash: ng: command not found'.
npm config get prefix =
/Users/myusername/.npm-packages
npm config get
; cli configs
metrics-registry = "https://registry.npmjs.org/"
scope = ""
user-agent = "npm/5.5.1 node/v8.9.0 darwin x64"
; userconfig /Users/myusername/.npmrc
prefix = "/Users/myusername/.npm-packages"
; builtin config undefined
; node bin location = /usr/local/bin/node
; cwd = /Users/myusername/.npm-packages/etc
; HOME = /Users/myusername
; "npm config ls -l" to show all defaults.
npm info #angular/cli
{ name: '#angular/cli',
description: 'CLI tool for Angular',
'dist-tags': { latest: '1.5.0', next: '1.5.0-rc.8' },
versions:
[ '1.0.0-beta.28.3',
'1.0.0-beta.29',
'1.0.0-beta.30',
'1.0.0-beta.31',
'1.0.0-beta.32',
'1.0.0-beta.32.2',
'1.0.0-beta.32.3',
'1.0.0-beta.33',
'1.0.0-beta.33.1',
'1.0.0-rc.0',
'1.0.0-rc.1',
'1.0.0-rc.2',
'1.0.0-rc.3',
'1.0.0-rc.4',
'1.0.0',
'1.0.1',
'1.0.2',
'1.0.3',
'1.0.4',
'1.0.5',
'1.0.6',
'1.1.0-beta.0',
'1.1.0-beta.1',
'1.1.0-rc.0',
'1.1.0-rc.1',
'1.1.0-rc.2',
'1.1.0',
'1.1.1',
'1.1.2',
'1.1.3',
'1.2.0-beta.0',
'1.2.0-beta.1',
'1.2.0-rc.0',
'1.2.0-rc.1',
'1.2.0',
'1.2.1',
'1.2.2',
'1.2.3',
'1.2.4',
'1.2.5',
'1.2.6',
'1.2.7',
'1.2.8',
'1.3.0-beta.0',
'1.3.0-beta.1',
'1.3.0-rc.0',
'1.3.0-rc.1',
'1.3.0-rc.2',
'1.3.0-rc.3',
'1.3.0-rc.4',
'1.3.0-rc.5',
'1.3.0',
'1.3.1',
'1.3.2',
'1.4.0-beta.0',
'1.4.0-beta.1',
'1.4.0-beta.2',
'1.4.0-rc.0',
'1.4.0-rc.1',
'1.4.0-rc.2',
'1.4.0',
'1.4.1',
'1.4.2',
'1.4.3',
'1.4.4',
'1.4.5',
'1.4.6',
'1.4.7',
'1.4.8',
'1.4.9',
'1.5.0-beta.0',
'1.5.0-beta.1',
'1.5.0-beta.2',
'1.5.0-beta.3',
'1.5.0-beta.4',
'1.5.0-rc.0',
'1.5.0-rc.1',
'1.5.0-rc.2',
'1.5.0-rc.3',
'1.5.0-rc.4',
'1.5.0-rc.5',
'1.5.0-rc.6',
'1.5.0-rc.7',
'1.5.0-rc.8',
'1.5.0' ],
maintainers:
[ 'angular-cli <hansl#google.com>',
'angular <angular-core+npm#google.com>' ],
time:
{ modified: '2017-11-01T19:14:57.082Z',
created: '2017-02-01T22:39:48.654Z',
'1.0.0-beta.28.3': '2017-02-01T22:39:48.654Z',
'1.0.0-beta.29': '2017-02-02T02:31:47.645Z',
'1.0.0-beta.30': '2017-02-03T01:33:52.259Z',
'1.0.0-beta.31': '2017-02-09T23:56:06.277Z',
'1.0.0-beta.32': '2017-02-17T01:51:53.654Z',
'1.0.0-beta.32.2': '2017-02-17T02:00:52.484Z',
'1.0.0-beta.32.3': '2017-02-17T02:08:23.149Z',
'1.0.0-beta.33': '2017-02-25T05:21:36.887Z',
'1.0.0-beta.33.1': '2017-02-25T05:59:19.475Z',
'1.0.0-rc.0': '2017-02-25T07:30:35.378Z',
'1.0.0-rc.1': '2017-03-03T03:12:06.772Z',
'1.0.0-rc.2': '2017-03-13T23:35:46.979Z',
'1.0.0-rc.3': '2017-03-21T00:49:12.653Z',
'1.0.0-rc.4': '2017-03-21T01:33:52.067Z',
'1.0.0': '2017-03-24T03:08:08.615Z',
'1.0.1': '2017-04-25T02:55:49.584Z',
'1.0.2': '2017-05-03T22:57:19.031Z',
'1.1.0-beta.0': '2017-05-03T23:50:36.374Z',
'1.0.3': '2017-05-09T21:00:17.413Z',
'1.1.0-beta.1': '2017-05-09T21:42:35.163Z',
'1.1.0-rc.0': '2017-05-15T22:19:37.926Z',
'1.0.4': '2017-05-18T17:54:04.979Z',
'1.0.5': '2017-05-24T22:17:19.130Z',
'1.1.0-rc.1': '2017-05-24T22:36:47.469Z',
'1.0.6': '2017-05-25T17:57:32.914Z',
'1.1.0-rc.2': '2017-05-25T18:22:24.404Z',
'1.1.0': '2017-05-31T20:22:53.831Z',
'1.2.0-beta.0': '2017-05-31T21:13:50.572Z',
'1.1.1': '2017-06-07T21:01:59.836Z',
'1.2.0-beta.1': '2017-06-07T21:44:09.173Z',
'1.1.2': '2017-06-15T20:39:42.222Z',
'1.2.0-rc.0': '2017-06-15T21:16:57.470Z',
'1.1.3': '2017-06-21T21:48:12.505Z',
'1.2.0-rc.1': '2017-06-21T22:31:33.214Z',
'1.2.0': '2017-06-29T19:21:25.576Z',
'1.3.0-beta.0': '2017-06-29T19:55:56.904Z',
'1.2.1': '2017-07-12T17:34:40.198Z',
'1.3.0-beta.1': '2017-07-12T18:38:33.167Z',
'1.2.2': '2017-07-20T21:06:26.951Z',
'1.2.3': '2017-07-21T17:57:50.477Z',
'1.3.0-rc.0': '2017-07-21T22:22:01.734Z',
'1.2.4': '2017-07-24T19:01:16.743Z',
'1.3.0-rc.1': '2017-07-24T19:03:08.281Z',
'1.2.5': '2017-07-26T21:09:37.299Z',
'1.3.0-rc.2': '2017-07-26T21:26:55.403Z',
'1.2.6': '2017-07-27T18:29:09.611Z',
'1.3.0-rc.3': '2017-07-27T18:55:31.455Z',
'1.2.7': '2017-08-03T17:51:53.604Z',
'1.3.0-rc.4': '2017-08-03T18:26:06.546Z',
'1.3.0-rc.5': '2017-08-03T19:16:35.510Z',
'1.2.8': '2017-08-09T22:34:57.034Z',
'1.3.0': '2017-08-09T23:33:40.392Z',
'1.4.0-beta.0': '2017-08-10T23:31:35.610Z',
'1.3.1': '2017-08-17T20:44:40.289Z',
'1.4.0-beta.1': '2017-08-18T00:00:02.218Z',
'1.4.0-beta.2': '2017-08-18T19:06:12.921Z',
'1.3.2': '2017-08-23T22:03:53.021Z',
'1.4.0-rc.0': '2017-08-23T22:11:28.919Z',
'1.4.0-rc.1': '2017-08-25T21:05:15.145Z',
'1.4.0-rc.2': '2017-08-30T00:23:14.662Z',
'1.4.0': '2017-09-07T16:31:09.637Z',
'1.4.1': '2017-09-08T22:39:19.578Z',
'1.5.0-beta.0': '2017-09-14T00:03:25.612Z',
'1.4.2': '2017-09-14T00:35:39.637Z',
'1.4.3': '2017-09-22T02:00:04.404Z',
'1.5.0-beta.1': '2017-09-22T02:02:52.519Z',
'1.4.4': '2017-09-28T23:01:05.205Z',
'1.5.0-beta.2': '2017-09-28T23:03:16.645Z',
'1.5.0-beta.3': '2017-10-03T20:33:31.803Z',
'1.4.5': '2017-10-05T21:29:06.347Z',
'1.5.0-beta.4': '2017-10-05T21:32:26.527Z',
'1.4.6': '2017-10-12T01:31:14.231Z',
'1.4.7': '2017-10-12T16:52:14.901Z',
'1.5.0-rc.0': '2017-10-12T17:28:05.424Z',
'1.4.8': '2017-10-18T20:09:29.000Z',
'1.5.0-rc.1': '2017-10-18T20:13:37.270Z',
'1.4.9': '2017-10-19T22:54:59.961Z',
'1.5.0-rc.2': '2017-10-19T23:36:26.426Z',
'1.5.0-rc.3': '2017-10-24T05:17:28.861Z',
'1.5.0-rc.4': '2017-10-26T17:21:40.607Z',
'1.5.0-rc.5': '2017-10-27T01:21:13.361Z',
'1.5.0-rc.6': '2017-10-28T00:35:11.786Z',
'1.5.0-rc.7': '2017-10-30T18:27:09.785Z',
'1.5.0-rc.8': '2017-10-30T23:39:34.512Z',
'1.5.0': '2017-11-01T19:14:57.082Z' },
homepage: 'https://github.com/angular/angular-cli',
keywords: [ 'angular', 'angular-cli', 'Angular CLI' ],
repository:
{ type: 'git',
url: 'git+https://github.com/angular/angular-cli.git' },
author: 'Angular Authors',
bugs: { url: 'https://github.com/angular/angular-cli/issues' },
license: 'MIT',
readmeFilename: 'README.md',
users:
{ avil13: true,
tonimoeckel: true,
jota: true,
baschte: true,
stormos: true,
szamocza: true,
db6edr: true,
willvanpelt: true,
'ognjen.jevremovic': true,
plastikaweb: true,
waiwaiku: true,
adli: true,
reekdeb: true,
'n.sanitate': true,
niilante: true,
qingqingcao: true,
stefaans: true,
'jlouros-io': true,
fadihania: true,
wilda: true,
fdagosti: true,
albertico88: true,
kremr: true,
plauret: true,
infrabill: true,
manojkhannakm: true,
julianomontini: true,
'stone-jin': true,
springy: true,
fmakareev: true,
rastrearcelularonline: true,
majkel: true,
onsentamago: true,
markymark: true,
korbraan: true,
allen_l_liu: true,
polyeezy: true,
joshdoescode: true,
sirhcybe: true,
shadster: true,
samersm: true,
tommyldunn: true,
willwm: true,
aran_sk: true,
khcjump: true,
orenschwartz: true,
yangzw: true,
stephanlv: true,
advpat: true,
tifbs: true,
johnnyjohnjohn: true,
iamclaytonray: true,
shekharreddy: true,
elijahsh: true },
version: '1.5.0',
main: 'lib/cli/index.js',
trackingCode: 'UA-8594346-19',
bin: { ng: './bin/ng' },
engines: { node: '>= 6.9.0', npm: '>= 3.0.0' },
dependencies:
{ '#angular-devkit/build-optimizer': '~0.0.31',
'#angular-devkit/schematics': '~0.0.34',
'#ngtools/json-schema': '1.1.0',
'#ngtools/webpack': '1.8.0',
'#schematics/angular': '~0.1.0',
autoprefixer: '^6.5.3',
chalk: '~2.2.0',
'circular-dependency-plugin': '^3.0.0',
'common-tags': '^1.3.1',
'copy-webpack-plugin': '^4.1.1',
'core-object': '^3.1.0',
'css-loader': '^0.28.1',
cssnano: '^3.10.0',
denodeify: '^1.2.1',
'ember-cli-string-utils': '^1.0.0',
'exports-loader': '^0.6.3',
'extract-text-webpack-plugin': '3.0.0',
'file-loader': '^1.1.5',
'fs-extra': '^4.0.0',
glob: '^7.0.3',
'html-webpack-plugin': '^2.29.0',
'karma-source-map-support': '^1.2.0',
less: '^2.7.2',
'less-loader': '^4.0.5',
'license-webpack-plugin': '^1.0.0',
lodash: '^4.11.1',
'memory-fs': '^0.4.1',
'node-modules-path': '^1.0.0',
nopt: '^4.0.1',
opn: '~5.1.0',
portfinder: '~1.0.12',
'postcss-custom-properties': '^6.1.0',
'postcss-loader': '^1.3.3',
'postcss-url': '^5.1.2',
'raw-loader': '^0.5.1',
resolve: '^1.1.7',
rxjs: '^5.5.2',
'sass-loader': '^6.0.3',
semver: '^5.1.0',
'silent-error': '^1.0.0',
'source-map-loader': '^0.2.0',
'source-map-support': '^0.4.1',
'istanbul-instrumenter-loader': '^2.0.0',
'style-loader': '^0.13.1',
stylus: '^0.54.5',
'stylus-loader': '^3.0.1',
'uglifyjs-webpack-plugin': '1.0.0',
'url-loader': '^0.6.2',
webpack: '~3.8.1',
'webpack-concat-plugin': '1.4.0',
'webpack-dev-middleware': '~1.12.0',
'webpack-dev-server': '~2.9.3',
'webpack-merge': '^4.1.0',
'webpack-sources': '^1.0.0',
'webpack-subresource-integrity': '^1.0.1',
'zone.js': '^0.8.14',
'node-sass': '^4.3.0' },
optionalDependencies: { 'node-sass': '^4.3.0' },
dist:
{ integrity: 'sha512-nCXvqNCdi+8aOU2v6EABZsMg5bB7iM+wfaoWKnu9M5fOW2Rm+7/3Y1gDQKyFkgXCzXdy3J/xpfmwT0gjmjlvIA==',
shasum: '2abc3ff1648d54ad4a14f82f9d517f371370406c',
tarball: 'https://registry.npmjs.org/#angular/cli/-/cli-1.5.0.tgz' },
directories: {} }
I'll be talking about Angular CLI only.
With reference to Angular CLI, I'll assume that you tried installing it without -g flag with NPM.
Step 1: Install Angular CLI from NPM
npm install -g #angular/cli
Step 2: Generate a new app from Angular CLI
ng new <APP NAME>
Step 3: Changing directories
cd <APP NAME>
Step 4: Serving your app
ng serve
If all fails, please have a try of the following.
Step 1: Changing directories (Fallback Option)
cd <NPM ANGULAR CLI DIRECTORY>
Step 2: Running ng locally (Fallback Option)
./bin/ng new <APP NAME> --directory <WHERE EVER YOU WANT IT TO GENERATE>
Hope this helps.
Related
Nuxt installation error : Rule can only have one resource source (provided resource and test + include + exclude)
I successfully installed Vuejs and Nodejs but got a problem when installing Nuxtjs. This is what I get. I already asked some friends but it didn't work. Thanks for your help ! :)
Error : Rule can only have one resource source (provided resource and test + include + exclude)
Rule can only have one resource source (provided resource and test + include + exclude) in {
"use": [
{
"loader": "C:\\Users\\User\\Desktop\\JS\\my-first-project\\node_modules\\babel-loader\\lib\\index.js",
"options": {
"configFile": false,
"babelrc": false,
"cacheDirectory": true,
"envName": "server",
"presets": [
[
"C:\\Users\\User\\Desktop\\JS\\my-first-project\\node_modules\\#nuxt\\babel-preset-app\\src\\index.js",
{
"corejs": {
"version": 3
}
}
]
]
},
"ident": "clonedRuleSet-30[0].rules[0].use[0]"
}
]
}
"use": [
{
"loader": "C:\\Users\\User\\Desktop\\JS\\my-first-project\\node_modules\\babel-loader\\lib\\index.js",
"options": {
"configFile": false,
"babelrc": false,
"cacheDirectory": true,
"envName": "server",
"presets": [
[
"C:\\Users\\User\\Desktop\\JS\\my-first-project\\node_modules\\#nuxt\\babel-preset-app\\src\\index.js",
{
"corejs": {
"version": 3
}
}
]
]
},
"ident": "clonedRuleSet-30[0].rules[0].use[0]"
}
]
}
at checkResourceSource (node_modules\#nuxt\webpack\node_modules\webpack\lib\RuleSet.js:167:11)
at Function.normalizeRule (node_modules\#nuxt\webpack\node_modules\webpack\lib\RuleSet.js:198:4)
at node_modules\#nuxt\webpack\node_modules\webpack\lib\RuleSet.js:110:20
at Array.map (<anonymous>)
at Function.normalizeRules (node_modules\#nuxt\webpack\node_modules\webpack\lib\RuleSet.js:109:17)
at new RuleSet (node_modules\#nuxt\webpack\node_modules\webpack\lib\RuleSet.js:104:24)
at new NormalModuleFactory (node_modules\#nuxt\webpack\node_modules\webpack\lib\NormalModuleFactory.js:115:18)
at Compiler.createNormalModuleFactory (node_modules\#nuxt\webpack\node_modules\webpack\lib\Compiler.js:636:31)
at Compiler.newCompilationParams (node_modules\#nuxt\webpack\node_modules\webpack\lib\Compiler.js:653:30)
at Compiler.compile (node_modules\#nuxt\webpack\node_modules\webpack\lib\Compiler.js:661:23)
at node_modules\#nuxt\webpack\node_modules\webpack\lib\Watching.js:77:18
at AsyncSeriesHook.eval [as callAsync] (eval at create (node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:22:1)
at AsyncSeriesHook.lazyCompileHook (node_modules\tapable\lib\Hook.js:154:20)
at Watching._go (node_modules\#nuxt\webpack\node_modules\webpack\lib\Watching.js:41:32)
at node_modules\#nuxt\webpack\node_modules\webpack\lib\Watching.js:33:9
at Compiler.readRecords (node_modules\#nuxt\webpack\node_modules\webpack\lib\Compiler.js:529:11)
npm i -D webpack#^4.46.0 try this, it worked for me.
I've had the same issue today, it seems to be related to an npm dependencies resolution issue. I have opened an issue in nuxt.js repository In my project, the issue was present, cause of #nuxtjs/eslint-module, you can remove it and regen dependencies : npm uninstall #nuxtjs/eslint-module rm -rf node_modules package-lock.json npm install You will not longer have eslint feedbacks in your build command, but you can still use npm run lint, and you will be able to use nuxt until the issue will be fixed.
I ran into this same error while trying to upgrade one of my old NuxtJS projects (using sass) built on node version 12 to version 16. To fix this, i also installed #nuxtjs/style-resources that matches my versions of sass-loader and node-sass. To confirm, uninstall the ones you already have, and run npm install --save-dev node-sass sass-loader#10 fibers #nuxtjs/style-resources see this article for more
This happened to me when I installed the most recent version of copy-webpack-plugin in Nuxt v2 project. Apparently it doesn't use webpack5 so I had to downgrade copy-webpack-plugin to last compatible version e.g. copy-webpack-plugin#4.6.0
Yarn: Error An unexpected error occurred: Request failed \"404 Not Found\
I´ve got an issue when I run my program with Yarn.
error An unexpected error occurred: "https://npm.pkg.github.com/download/{.../packagename}: Request failed \"404 Not Found\"".
I cloned a GitHub-Repo and installed NodeJS, npm, and Yarn.
I also create a personal access token at GitHub. And configured the registry with:
npm login --registry=https://npm.pkg.github.com
Username: USERNAME
Password: TOKEN
Email: PUBLIC-EMAIL-ADDRESS
info yarn config
{
'version-tag-prefix': 'v',
'version-git-tag': true,
'version-commit-hooks': true,
'version-git-sign': false,
'version-git-message': 'v%s',
'init-version': '1.0.0',
'init-license': 'MIT',
'save-prefix': '^',
'bin-links': true,
'ignore-scripts': false,
'ignore-optional': false,
registry: 'https://registry.yarnpkg.com',
'strict-ssl': false,
'user-agent': 'yarn/1.22.4 npm/? node/v13.8.0 darwin x64',
lastUpdateCheck: 1585820467684
}
info npm config
{
'//npm.pkg.github.com/:_authToken': `{TOKEN}`,
'always-auth': true,
`# { VALUE }:registry`: 'https://npm.pkg.github.com/'
}
Environment
Node Version: 13.8.0
npm Version: 6.13.6
Yarn Version: 1.22.4
Error code 135, Error message Could not fingd update-config.json. Run webdriver-manager update to download the binaries
I am trying to execute my tests in nodejs using protractor.
Example protractor protractor.conf
When I run protractor protractor.conf, I get error Error code 135, Error message Could not fingd update-config.json. Run webdriver-manager update to download the binaries
I ran the following command but still get the above error message
webdriver-manager update -- proxy http://
protractor.conf.js
/*global jasmine */
var SpecReporter = require('jasmine-spec-reporter');
var TfsReporter = require('jasmine-tfs-reporter');
exports.config = {
allScriptsTimeout: 11000,
specs: [
'./src/tests/*spec.js'
],
capabilities: {
'browserName': 'chrome',
/*'browserName': 'phantomjs',
'phantomjs.binary.path': require('phantomjs-prebuilt').path,
'phantomjs.ghostdriver.cli.args': ['--loglevel=DEBUG']*/
},
directConnect: true,
baseUrl: 'http://localhost:4200/',
framework: 'jasmine',
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 30000,
print: function() {}
},
useAllAngular2AppRoots: false,
beforeLaunch: function() {
require('ts-node').register({
project: '../PartyAndIndustryDataMigration'
});
},
onPrepare: function() {
jasmine.getEnv().addReporter(new SpecReporter());
jasmine.getEnv().addReporter(new TfsReporter());
}
};
I'm not 100% sure (and cannot it check now), but shouldn't command look like that: webdriver-manager update --proxy http:// (without space between -- and proxy)?
I guess chrome driver & update-config.json couldn't downloaded at the time of webdriver-manager update. Just for verification go to node_modules\protractor\node_modules\webdriver-manager\selenium\ location and look if everything downloaded properly? If there is problem on downloading chrome driver you can check chrome-response.xml in same location for reason. One reason could be chrome driver website is in blacklisted or behind the proxy.
1.Open Command prompt or terminal. 2.Go to your project root directory. 3.Enter the below command and hit Enter key. node node_modules/protractor/bin/webdriver-manager update This command will update the WebDriver Manager.
Is 'El Capitan's' rootless breaking old grunt configs?
After migrating to El Capitan, it seems users are experiencing an issue with grunt installations, possibly related to the rootless changes of El Capitan. In particular, running the grunt --force command results in EPERM errors. The workflow is as follows:
Assuming npm has been installed, navigate to the grunt directory with package.json and gruntfile.js and invoke grunt:
grunt --force
Example Gruntfile.js file contents:
module.exports = function(grunt) {
// All configuration goes here
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
concat: {
// Configuration for concatenating files goes here.
dist: {
src: [
'../js/libs/owl.carousel.js',
'../js/libs/jquery.actual.js',
'../js/libs/chosen.jquery.js',
'../js/libs/jquery.parallax.js',
'../js/src/common.js'
],
dest: '../js/pro/global.js',
},
},
uglify: {
build: {
src: '../js/pro/global.js',
dest: '../js/pro/global.min.js',
},
},
imagemin: {
dynamic: {
files: [{
expand: true,
cwd: '../img/src/',
src: ['**/*.{png,jpg,gif}'],
dest: '../img/pro/'
}]
}
},
compass: {
dev: {
options: {
sassDir: '../sass',
cssDir: '../css',
fontsDir: '../fonts',
imagesDir: '../img/',
images: '../img/',
javascriptsDir: '../js/pro',
//environment: 'development',
outputStyle: 'compressed',
relativeAssets: true,
httpPath: '.',
}
},
},
watch: {
scripts: {
files: ['../js/**/**.js'],
tasks: ['concat', 'uglify'],
options: {
spawn: true,
},
},
images: {
files: ['../img/src/**.{png,jpg,gif}'],
tasks: ['imagemin'],
options: {
spawn: true,
}
},
compass: {
files: ['../**/*.{scss,sass}'],
tasks: ['compass:dev'],
}
},
svgstore: {
defaults: {
options: {
prefix : 'icon-',
},
files: {
'../img/svg-defs.svg': ['../img/svg/*.svg']
}
}
},
});
// Where we tell Grunt we plan to use this plug-in.
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-imagemin');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-compass');
grunt.loadNpmTasks('grunt-svgstore');
// Where we tell Grunt what to do when we type "grunt" into the terminal.
grunt.registerTask('default', ['concat', 'uglify', /*'imagemin',*/ 'compass', 'svgstore', 'watch']);
};
Example package.json file contents:
{
"name": "Call Me Maybe",
"version": "0.2.0",
"devDependencies": {
"grunt": "^0.4.5",
"grunt-contrib-compass": "^1.0.4",
"grunt-contrib-concat": "^0.5.1",
"grunt-contrib-imagemin": "^0.9.4",
"grunt-contrib-sass": "^0.9.2",
"grunt-contrib-uglify": "^0.9.2",
"grunt-contrib-watch": "^0.6.1",
"grunt-svgstore": "^0.5.0"
}
}
The resulting EPERM errors are as follows:
Running "concat:dist" (concat) task
Warning: Unable to write "../js/pro/global.js" file (Error code: EPERM). Used --force, continuing.
Running "uglify:build" (uglify) task
Warning: Unable to write "../js/pro/global.min.js" file (Error code: EPERM). Used --force, continuing.
Running "compass:dev" (compass) task
Warning: Command failed: /bin/sh: compass: command not found. Used --force, continuing.
Warning: You need to have Ruby and Compass installed and in your system PATH for this task to work. More info: https://github.com/gruntjs/grunt-contrib-compass Used --force, continuing.
Running "svgstore:defaults" (svgstore) task
Warning: Unable to write "../img/svg-defs.svg" file (Error code: EPERM). Used --force, continuing.
Running "watch" task
Waiting...
Interestingly, Ruby and Compass are also installed, so it does align with the theory of the rootless unable to write to folders issues, but how can the dependency cores be moved elsewhere (i.e. /usr/local/bin) so this isn't an issue?
During the El Capitan Betas, some users suggested enabling root via terminal - though this seemingly no longer works, as the error persists and /usr/bin folder still doesn't allow for permission changes.
For those running into the same issue, I had to eliminate the use of binaries installed to the path: /usr/bin, and reinstall after updating the path /usr/local/bin. Ruby tended to be the primary culprit. Because I was struggling with locating all my ruby installs, I ended up installing rbenv to manage my ruby versions. The following terminal commands may be helpful in identifying your problematic paths: which ruby gem environment gem uninstall [insert gem name here] [google how to set your paths to /usr/local/bin... (will be in a hidden file)] gem install [insert gem name here]
Installing non-system software on /usr/bin is a bad move, and is now prohibited in El Capitan, and with good reason. I am not familiar with grunt, but if you can get to use /usr/local/bin instead then probably everything works.
Can't find module Bootstrap
The directory which i am running "grunt" on has node_module folder which contains all the modules including : Bootstrap, Browserify and others.
When i run "grunt"
I get :
Running "jshint:files" (jshint) task
>> 12 files lint free.
Running "copy:build" (copy) task
Created 1 directories, copied 17 files
Running "concat:vendorcss" (concat) task
File "build-css/vendor.less" created.
Running "less:libremap" (less) task
File build/css/libremap.css created.
Running "jst:compile" (jst) task
File "build-jst/templates.js" created.
Running "browserify:vendor" (browserify) task
>> Bundled build/vendor/vendor.js
Running "browserify:libremap" (browserify) task
Warning: Cannot find module 'bootstrap' Use --force to continue.
It stops at browserify and says cannot find module 'bootstrap' before this scenario, it said there wasn't "jquery" which i installed with "npm install jquery" after restarting "grunt" , a few other missing modules were also reported subsequently which i installed.However with bootstrap, even after installing and making sure it exist in node_modules directory, i still have this error.
Any help will be appreciated.
I am new to grunt, npm, nodejs etc. I am just trying to setup a
software.
Task Code Appended.
There are two Browserify tasks, i assume the first complete successfully from the output above ?
browserify: {
vendor: {
src: [],
dest: 'build/vendor/vendor.js',
options: {
shim: {
jquery: {
path: 'bower_components/jquery/jquery.min.js',
exports: '$'
},
bootstrap: {
path: 'bower_components/bootstrap/dist/js/bootstrap.min.js',
exports: 'bootstrap',
depends: {
'jquery': 'jQuery'
}
},
leaflet: {
path: 'vendor/leaflet/leaflet.js',
exports: 'L'
},
'leaflet-markercluster': {
path: 'vendor/leaflet.markercluster/leaflet.markercluster.js',
exports: 'L',
depends: {
'leaflet': 'L'
}
}
}
}
},
// browserify libremap.js -> bundle.js
libremap: {
dest: 'build/js/libremap.js',
src: [ 'src/js/libremap.js' ],
options: {
debug: grunt.option('debug'),
external: ['jquery', 'bootstrap', 'leaflet', 'leaflet-markercluster'],
shim: {
templates: {
path: 'build-jst/templates.js',
exports: 'JST',
depends: {
'underscore': '_'
}
}
}
Try this, it should help:
`bootstrap: {
path: 'bower_components/bootstrap/dist/js/bootstrap.min.js',
exports: 'bootstrap',
depends: {
'jquery': '$'
}
},`
The piont is you export $ not jQuery.
Try: npm -g install bower bower install bootstrap