1. 问题
今天用yeoman搭建angular环境,搭建完成之后,执行操作:
gulp serve
页面老是报错:Uncaught ReferenceError: angular is not defined(…)
2. 操作步骤
npm install -g generator-angular
yo angular angular-in-action
cnpm install && bower install
这个时候执行gulp serve
就会出现文章一开始说的问题。
打开index.html
,可以如下代码,注意不能删除,这样页面才在哪放置 inject 数据流
<!-- build:js(.) scripts/vendor.js -->
<!-- bower:js -->
<!-- endbower -->
<!-- endbuild -->
3. 解决方法
3.1 为taskserve
添加bower任务
gulp.task('serve', function (cb) {
runSequence('clean:tmp',
['lint:scripts'],
['start:client'],
['bower'], //添加bower
'watch', cb);
});
3.2 修改bower
输出路径
// inject bower components
gulp.task('bower', function () {
return gulp.src(paths.views.main)
.pipe(wiredep({
directory: yeoman.app + '/bower_components',
ignorePath: '..'
}))
.pipe(gulp.dest(yeoman.app)); //修改输出路径
});
3.3 拷贝bower_components
到app
目录下
重新执行
gulp serve
完成
issue:
https://github.com/yeoman/generator-angular/issues/1295
https://github.com/yeoman/generator-angular/issues/1299