So this is not running as I would expect, nor as the tutorial suggests. Through some research I've found some solutions, but they've only got me so far. Following the tutorial as written doesn't work at all. I finally got the packages I needed installed by using
npm install -g grunt-cli bower yo generator-karma generator-angular
So I can make it to this point with no errors, but after running yo angular the bower_components are never installed. Screen shots below
So the rest of this is copy paste from my console. I'm running Windows 7 64-bit using Cmder for the console. Node/package versions are in the paste:
C:\_dev
λ node --version && npm --version && yo --version && bower --version && grunt --version
v4.2.2
3.4.1
1.5.0
1.6.5
grunt-cli v0.1.13
C:\_dev
λ yo
? 'Allo! What would you like to do? (Use arrow keys)
Run a generator
> Angular
Karma
──────────────
Update your generators
Install a generator
Find some help
Get me out of here!
──────────────
I chose "Get me out of here!" at this point as I was just ensuring that generator-angular and generator-karma were installed.
C:\_dev
λ mkdir yoapp && cd yoapp
C:\_dev\yoapp
λ yo angular
_-----_
| | .--------------------------.
|--(o)--| | Welcome to Yeoman, |
`---------´ | ladies and gentlemen! |
( _´U`_ ) '--------------------------'
/___A___\
| ~ |
__'.___.'__
´ ` |° ´ Y `
Out of the box I include Bootstrap and some AngularJS recommended modules.
? Would you like to use Gulp (experimental) instead of Grunt? No
? Would you like to use Sass (with Compass)? No
? Would you like to include Bootstrap? Yes
? Which modules would you like to include? (Press <space> to select)
>(*) angular-animate.js
( ) angular-aria.js
(*) angular-cookies.js
(*) angular-resource.js
( ) angular-messages.js
(*) angular-route.js
(*) angular-sanitize.js
(*) angular-touch.js
I hit Enter with the above configuration. A short time into the run, errors start to appear. I'm cutting out all non-error messages below. [note: did have to overwrite package.json -- which the tutorial suggests is a temporary error, and is the advice it gives]
bower ENORESTARGET No tag found that was able to satisfy ^3.2.0
Additional error details:
loadDep:grunt-legacy-log ▀ ╢██████████████████████████░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░╟ grunt-cli: The grunt command line interface. (v0.1.13)
Fatal error: Unable to find local grunt.
If you're seeing this message, either a Gruntfile wasn't found or grunt
hasn't been installed locally to your project. For more information about
installing and configuring grunt, please see the Getting Started guide
...
├── UNMET PEER DEPENDENCY jasmine-core@*
...
├── UNMET PEER DEPENDENCY karma@^0.13.0 || >= 0.14.0-rc.0
...
├── UNMET PEER DEPENDENCY phantomjs@>=1.9
...
npm WARN EPEERINVALID karma-phantomjs-launcher@0.2.1 requires a peer of karma@>=0.9 but none was installed.
npm WARN EPEERINVALID karma-phantomjs-launcher@0.2.1 requires a peer of phantomjs@>=1.9 but none was installed.
npm WARN EPEERINVALID grunt-karma@0.12.1 requires a peer of karma@^0.13.0 || >= 0.14.0-rc.0 but none was installed.
npm WARN EPEERINVALID karma-jasmine@0.3.6 requires a peer of jasmine-core@* but none was installed.
C:\cmder/vendor/clink-completions/npm_prompt.lua:11: attempt to concatenate local 'package_version' e) nil valu
C:\_dev\yoapp {git}{hg}
{lamb}
Note that the command prompt in Cmder (the shell program I am using) should be a lambda: λ
and after running "yo angular" it changes to {lamb}, but only inside the C:_dev\yoapp folder. Moving up or down one level in the directory structure restores it to normal.
The example scaffold in the tutorial does not match what I get (see screen_shot_1.jpg). Screen shots 2 and 3 are just to show some of what I pasted above into context.
Last but not least, here's the info output that has been requested:
// # Globbing
// for performance reasons we're only matching one level down:
// 'test/spec/{,/}.js'
// use this if you want to recursively match all subfolders:
// 'test/spec/*/.js'
module.exports = function (grunt) {
// Time how long tasks take. Can help when optimizing build times
require('time-grunt')(grunt);
// Configurable paths for the application
var appConfig = {
app: require('./bower.json').appPath || 'app',
dist: 'dist'
};
// Define the configuration for all the tasks
grunt.initConfig({
// Project settings
yeoman: appConfig,
// Watches files for changes and runs tasks based on the changed files
watch: {
bower: {
files: ['bower.json'],
tasks: ['wiredep']
},
js: {
files: ['<%= yeoman.app %>/scripts/{,*/}*.js'],
tasks: ['newer:jshint:all', 'newer:jscs:all'],
options: {
livereload: '<%= connect.options.livereload %>'
}
},
jsTest: {
files: ['test/spec/{,*/}*.js'],
tasks: ['newer:jshint:test', 'newer:jscs:test', 'karma']
},
styles: {
files: ['<%= yeoman.app %>/styles/{,*/}*.css'],
tasks: ['newer:copy:styles', 'postcss']
},
gruntfile: {
files: ['Gruntfile.js']
},
livereload: {
options: {
livereload: '<%= connect.options.livereload %>'
},
files: [
'<%= yeoman.app %>/{,*/}*.html',
'.tmp/styles/{,*/}*.css',
'<%= yeoman.app %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}'
]
}
},
// The actual grunt server settings
connect: {
options: {
port: 9000,
// Change this to '0.0.0.0' to access the server from outside.
hostname: 'localhost',
livereload: 35729
},
livereload: {
options: {
open: true,
middleware: function (connect) {
return [
connect.static('.tmp'),
connect().use(
'/bower_components',
connect.static('./bower_components')
),
connect().use(
'/app/styles',
connect.static('./app/styles')
),
connect.static(appConfig.app)
];
}
}
},
test: {
options: {
port: 9001,
middleware: function (connect) {
return [
connect.static('.tmp'),
connect.static('test'),
connect().use(
'/bower_components',
connect.static('./bower_components')
),
connect.static(appConfig.app)
];
}
}
},
dist: {
options: {
open: true,
base: '<%= yeoman.dist %>'
}
}
},
// Make sure there are no obvious mistakes
jshint: {
options: {
jshintrc: '.jshintrc',
reporter: require('jshint-stylish')
},
all: {
src: [
'Gruntfile.js',
'<%= yeoman.app %>/scripts/{,*/}*.js'
]
},
test: {
options: {
jshintrc: 'test/.jshintrc'
},
src: ['test/spec/{,*/}*.js']
}
},
// Make sure code styles are up to par
jscs: {
options: {
config: '.jscsrc',
verbose: true
},
all: {
src: [
'Gruntfile.js',
'<%= yeoman.app %>/scripts/{,*/}*.js'
]
},
test: {
src: ['test/spec/{,*/}*.js']
}
},
// Empties folders to start fresh
clean: {
dist: {
files: [{
dot: true,
src: [
'.tmp',
'<%= yeoman.dist %>/{,*/}*',
'!<%= yeoman.dist %>/.git{,*/}*'
]
}]
},
server: '.tmp'
},
// Add vendor prefixed styles
postcss: {
options: {
processors: [
require('autoprefixer-core')({browsers: ['last 1 version']})
]
},
server: {
options: {
map: true
},
files: [{
expand: true,
cwd: '.tmp/styles/',
src: '{,*/}*.css',
dest: '.tmp/styles/'
}]
},
dist: {
files: [{
expand: true,
cwd: '.tmp/styles/',
src: '{,*/}*.css',
dest: '.tmp/styles/'
}]
}
},
// Automatically inject Bower components into the app
wiredep: {
app: {
src: ['<%= yeoman.app %>/index.html'],
ignorePath: /\.\.\//
},
test: {
devDependencies: true,
src: '<%= karma.unit.configFile %>',
ignorePath: /\.\.\//,
fileTypes:{
js: {
block: /(([\s\t]*)\/{2}\s*?bower:\s*?(\S*))(\n|\r|.)*?(\/{2}\s*endbower)/gi,
detect: {
js: /'(.*\.js)'/gi
},
replace: {
js: '\'{{filePath}}\','
}
}
}
}
},
// Renames files for browser caching purposes
filerev: {
dist: {
src: [
'<%= yeoman.dist %>/scripts/{,*/}*.js',
'<%= yeoman.dist %>/styles/{,*/}*.css',
'<%= yeoman.dist %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}',
'<%= yeoman.dist %>/styles/fonts/*'
]
}
},
// Reads HTML for usemin blocks to enable smart builds that automatically
// concat, minify and revision files. Creates configurations in memory so
// additional tasks can operate on them
useminPrepare: {
html: '<%= yeoman.app %>/index.html',
options: {
dest: '<%= yeoman.dist %>',
flow: {
html: {
steps: {
js: ['concat', 'uglifyjs'],
css: ['cssmin']
},
post: {}
}
}
}
},
// Performs rewrites based on filerev and the useminPrepare configuration
usemin: {
html: ['<%= yeoman.dist %>/{,*/}*.html'],
css: ['<%= yeoman.dist %>/styles/{,*/}*.css'],
js: ['<%= yeoman.dist %>/scripts/{,*/}*.js'],
options: {
assetsDirs: [
'<%= yeoman.dist %>',
'<%= yeoman.dist %>/images',
'<%= yeoman.dist %>/styles'
],
patterns: {
js: [[/(images\/[^''""]*\.(png|jpg|jpeg|gif|webp|svg))/g, 'Replacing references to images']]
}
}
},
// The following *-min tasks will produce minified files in the dist folder
// By default, your `index.html`'s <!-- Usemin block --> will take care of
// minification. These next options are pre-configured if you do not wish
// to use the Usemin blocks.
// cssmin: {
// dist: {
// files: {
// '<%= yeoman.dist %>/styles/main.css': [
// '.tmp/styles/{,*/}*.css'
// ]
// }
// }
// },
// uglify: {
// dist: {
// files: {
// '<%= yeoman.dist %>/scripts/scripts.js': [
// '<%= yeoman.dist %>/scripts/scripts.js'
// ]
// }
// }
// },
// concat: {
// dist: {}
// },
imagemin: {
dist: {
files: [{
expand: true,
cwd: '<%= yeoman.app %>/images',
src: '{,*/}*.{png,jpg,jpeg,gif}',
dest: '<%= yeoman.dist %>/images'
}]
}
},
svgmin: {
dist: {
files: [{
expand: true,
cwd: '<%= yeoman.app %>/images',
src: '{,*/}*.svg',
dest: '<%= yeoman.dist %>/images'
}]
}
},
htmlmin: {
dist: {
options: {
collapseWhitespace: true,
conservativeCollapse: true,
collapseBooleanAttributes: true,
removeCommentsFromCDATA: true
},
files: [{
expand: true,
cwd: '<%= yeoman.dist %>',
src: ['*.html'],
dest: '<%= yeoman.dist %>'
}]
}
},
ngtemplates: {
dist: {
options: {
module: 'yoappApp',
htmlmin: '<%= htmlmin.dist.options %>',
usemin: 'scripts/scripts.js'
},
cwd: '<%= yeoman.app %>',
src: 'views/{,*/}*.html',
dest: '.tmp/templateCache.js'
}
},
// ng-annotate tries to make the code safe for minification automatically
// by using the Angular long form for dependency injection.
ngAnnotate: {
dist: {
files: [{
expand: true,
cwd: '.tmp/concat/scripts',
src: '*.js',
dest: '.tmp/concat/scripts'
}]
}
},
// Replace Google CDN references
cdnify: {
dist: {
html: ['<%= yeoman.dist %>/*.html']
}
},
// Copies remaining files to places other tasks can use
copy: {
dist: {
files: [{
expand: true,
dot: true,
cwd: '<%= yeoman.app %>',
dest: '<%= yeoman.dist %>',
src: [
'*.{ico,png,txt}',
'*.html',
'images/{,*/}*.{webp}',
'styles/fonts/{,*/}*.*'
]
}, {
expand: true,
cwd: '.tmp/images',
dest: '<%= yeoman.dist %>/images',
src: ['generated/*']
}, {
expand: true,
cwd: 'bower_components/bootstrap/dist',
src: 'fonts/*',
dest: '<%= yeoman.dist %>'
}]
},
styles: {
expand: true,
cwd: '<%= yeoman.app %>/styles',
dest: '.tmp/styles/',
src: '{,*/}*.css'
}
},
// Run some tasks in parallel to speed up the build process
concurrent: {
server: [
'copy:styles'
],
test: [
'copy:styles'
],
dist: [
'copy:styles',
'imagemin',
'svgmin'
]
},
// Test settings
karma: {
unit: {
configFile: 'test/karma.conf.js',
singleRun: true
}
}
});
grunt.registerTask('serve', 'Compile then start a connect web server', function (target) {
if (target === 'dist') {
return grunt.task.run(['build', 'connect:dist:keepalive']);
}
grunt.registerTask('server', 'DEPRECATED TASK. Use the "serve" task instead', function (target) {
grunt.log.warn('The server task has been deprecated. Use grunt serve to start a server.');
grunt.task.run(['serve:' + target]);
});
The codelab needs to be updated and there is already a ton of these issues open on the generator-angular repo, which also needs to be updated. Closing as duplicate of those. Thanks for the detailed report though.
So this is not running as I would expect, nor as the tutorial suggests. Through some research I've found some solutions, but they've only got me so far. Following the tutorial as written doesn't work at all. I finally got the packages I needed installed by using
So I can make it to this point with no errors, but after running
yo angular
the bower_components are never installed. Screen shots belowSo the rest of this is copy paste from my console. I'm running Windows 7 64-bit using Cmder for the console. Node/package versions are in the paste:
I chose "Get me out of here!" at this point as I was just ensuring that generator-angular and generator-karma were installed.
I hit Enter with the above configuration. A short time into the run, errors start to appear. I'm cutting out all non-error messages below. [note: did have to overwrite package.json -- which the tutorial suggests is a temporary error, and is the advice it gives]
Note that the command prompt in Cmder (the shell program I am using) should be a lambda: λ and after running "yo angular" it changes to {lamb}, but only inside the C:_dev\yoapp folder. Moving up or down one level in the directory structure restores it to normal.
The example scaffold in the tutorial does not match what I get (see screen_shot_1.jpg). Screen shots 2 and 3 are just to show some of what I pasted above into context.
Last but not least, here's the info output that has been requested:
C:_dev\yoapp {git}{hg} {lamb} yo --version && echo %PATH% %NODE_PATH% && node -e "console.log(process.platform, process.versions)" && type Gruntfile.js 1.5.0 C:\cmder\bin;C:\Program Files\Git\bin;C:\Program Files\Git\usr\bin;C:\Program Files\Git\share\vim\vim74;C:\cmder\vendor\conemu-maximus5;C:\cmder\vendor\conemu-maximus5\ConEmu;C:\ProgramData\Oracle\Java\javapath;C:\Ruby193\bin;C:\RailsInstaller\Ruby1.9.3\bin;C:\Program Files\Common Files\Microsoft Shared\Windows Live;C:\Program Files (x86)\Common Files\Microsoft Shared\Windows Live;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Program Files\Intel\WiFi\bin\;C:\Program Files\Common Files\Intel\WirelessCommon\;C:\Program Files (x86)\Windows Live\Shared;C:\Program Files (x86)\Common Files\Roxio Shared\OEM\DLLShared\;C:\Program Files (x86)\Common Files\Roxio Shared\OEM\DLLShared\;C:\Program Files (x86)\Common Files\Roxio Shared\OEM\12.0\DLLShared\;C:\Program Files (x86)\Roxio\OEM\AudioCore\;c:\Program Files (x86)\Microsoft SQL Server\100\Tools\Binn\;c:\Program Files\Microsoft SQL Server\100\Tools\Binn\;c:\Program Files\Microsoft SQL Server\100\DTS\Binn\;C:\Program Files\Sublime Text 2;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files\Calibre2\;C:\Program Files (x86)\Google\Google Apps Sync\;C:\Program Files (x86)\Google\Google Apps Migration\;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files\Microsoft\Web Platform Installer\;C:\Program Files\TortoiseSVN\bin;C:\Program Files (x86)\QuickTime Alternative\QTSystem\;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Program Files\Git\cmd;C:\Program Files\nodejs\;C:\Users\eehlers\AppData\Roaming\npm;C:\Ruby193\bin;C:\cmder %NODE_PATH% win32 { http_parser: '2.5.0', node: '4.2.2', v8: '4.5.103.35', uv: '1.7.5', zlib: '1.2.8', ares: '1.10.1-DEV', icu: '56.1', modules: '46', openssl: '1.0.2d' } // Generated on 2015-11-22 using generator-angular 0.14.0 'use strict';
// # Globbing // for performance reasons we're only matching one level down: // 'test/spec/{,/}.js' // use this if you want to recursively match all subfolders: // 'test/spec/*/.js'
module.exports = function (grunt) {
// Time how long tasks take. Can help when optimizing build times require('time-grunt')(grunt);
// Automatically load required Grunt tasks require('jit-grunt')(grunt, { useminPrepare: 'grunt-usemin', ngtemplates: 'grunt-angular-templates', cdnify: 'grunt-google-cdn' });
// Configurable paths for the application var appConfig = { app: require('./bower.json').appPath || 'app', dist: 'dist' };
// Define the configuration for all the tasks grunt.initConfig({
});
grunt.registerTask('serve', 'Compile then start a connect web server', function (target) { if (target === 'dist') { return grunt.task.run(['build', 'connect:dist:keepalive']); }
});
grunt.registerTask('server', 'DEPRECATED TASK. Use the "serve" task instead', function (target) { grunt.log.warn('The
server
task has been deprecated. Usegrunt serve
to start a server.'); grunt.task.run(['serve:' + target]); });grunt.registerTask('test', [ 'clean:server', 'wiredep', 'concurrent:test', 'postcss', 'connect:test', 'karma' ]);
grunt.registerTask('build', [ 'clean:dist', 'wiredep', 'useminPrepare', 'concurrent:dist', 'postcss', 'ngtemplates', 'concat', 'ngAnnotate', 'copy:dist', 'cdnify', 'cssmin', 'uglify', 'filerev', 'usemin', 'htmlmin' ]);
grunt.registerTask('default', [ 'newer:jshint', 'newer:jscs', 'test', 'build' ]); };
C:\cmder/vendor/clink-completions/npm_prompt.lua:11: attempt to concatenate local 'package_version' (a nil value)