简体   繁体   中英

Angular is not defined Gulp.js

I still have this error Angular is not defined. Im 99.9999% Sure its something to do with the paths not being confugred properly, but im out of clue. I cant fix it! This is my folder structure as of now:

bower_components/
node_modules/
app/
   components/
              home/
                   controller/
                              homeCtrl.js
                   css/
                         home.css
                   home.html

    shared/
           css/
           directives/
           filters/
           directives/
           sass/
           services/
assets/
    audio/
    debug/
    dist/
         app.min.js
         vendor.min.js
    lib/
    etc...

gulp/
   paths.js

gulpfile.js
index.html
etc....

It for some reason says angular is not defined.

Gulpfile.js:

//Require Gulp
var gulp = require("gulp");
var ngAnnotate = require("gulp-ng-annotate");
var uglify = require("gulp-uglify");
var concat = require("gulp-concat");
var sourceMaps = require("gulp-sourcemaps");
var util = require('gulp-util');
var coffee = require("gulp-coffee")
var clean = require("gulp-clean");
var expect = require('gulp-expect-file');
var sass = require('gulp-sass');
var es = require('event-stream');
var ng_annotate = require('gulp-ng-annotate')


var base = 'app';
// var minifyCss = require('gulp-minify-css');

var paths = require("./gulp/paths");

//remove temporary directories like dist
gulp.task('clean', function() {
    return gulp.src('assets/dist', {read: false})
    .pipe(clean());
});

// combines all js files into one and create sourcemaps for them
gulp.task('scripts', function(done) {
    gulp.src(paths.js)
    .pipe(sourceMaps.init())
    .pipe(concat('app.min.js'))
    .pipe(ngAnnotate())
    .pipe(uglify().on('error', util.log))
    .pipe(sourceMaps.write('.'))
    .pipe(gulp.dest(paths.dest))
    .on('error', util.log)
    .on('end', done);
});



gulp.task('copy', function() {
  var files = ['bower_components/angular/angular.min.js'];
  return gulp.src(files)
    .pipe(expect(files))
});

gulp.task('watch', function() {
    gulp.watch(paths.js, ['scripts'])
});

gulp.task('scripts:vendor', function() {
   return gulp.src(paths.vendor_js)
        //  .pipe(concat(paths.vendor_js[0]))
         .pipe(concat('vendor.min.js'))
         .pipe(uglify().on('error', util.log))
         .pipe(gulp.dest(paths.dest));
});


gulp.task('serve', function() {

})


gulp.task('default', function() {
    console.log("running gulp");
});

gulp/Paths.js:

module.exports = {
    dest: 'assets/dist',
    js: [
        'app/app.module.js',
        'app/app.run.js',
        'app/shared/**/*.module.js',
        'app/shared/**/*.js',
        'app/components/**/*.js',
        'app/components/**/*.module.js'
    ],
    sass: ['app/shared/**/*.sass'],
    vendor_js: [
         'bower_components/jquery/dist/jquery.js',
         'bower_components/angular/angular.min.js',
         'bower_components/**/*.min.js',
         'assets/lib/svg-assets-cache/svg-assets-cache.js',
         'assets/lib/alertifyjs/build/alertify.min.js',
         'assets/lib/Recaptcha/googleRecaptchaAPI.js',
         'assets/lib/angular-screenfull/angular-screenfull.min.js',
         'assets/lib/screenfull/screenfull.min.js',
         'assets/lib/angular-selectize/angular-selectize.js'
    ],
    vendor_styles: [
        'bower_components/selectize/dist/css/selectize.css',
        'bower_components/font-awesome/css/font-awesome.min.css',
        'assets/lib/alertifyjs/build/css/alertify.css',
        'assets/lib/alertifyjs/build/css/themes/semantic.min.css',
        'bower_components/vex/css/vex.css',
        'bower_components/vex/css/vex-theme-flat-attack.css',
        'assets/lib/material-charts/material-charts.min.css'
    ]
};

index.html:

<!DOCTYPE html>
<html lang="en" class="html_container">

<head>
    <meta charset="UTF-8">
    <!--<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">-->
    <meta name="viewport" content="width=1200">
    <title>Ng-Forum</title>

    <link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css" />
    <link rel="stylesheet" href="assets/lib/alertifyjs/build/css/alertify.css" />
    <link rel="stylesheet" href="assets/lib/alertifyjs/build/css/themes/semantic.min.css" />
    <link rel="stylesheet" href="bower_components/vex/css/vex.css" />
    <link rel="stylesheet" href="bower_components/vex/css/vex-theme-flat-attack.css" />
    <link rel="stylesheet" href="https://cdn.rawgit.com/amanuel2/MathGame/master/chartjs/material-charts.min.css" type="text/css" />
    <link rel="stylesheet" href="bower_components/angular-material/angular-material.css" />
    <link rel="icon" href="favicon.ico">

</head>

<body ng-app="ForumApp">
    <div ui-view></div>
    <!--<script type="text/javascript" src="https://code.angularjs.org/1.4.9/angular.js"></script>-->
    <script type="text/javscript" src="assets/dist/vendor.min.js"></script>
    <script type="text/javascript" src="assets/dist/app.min.js"></script>
</body>

</html>

Help would be greatly appreciated here! Btw im working it on Cloud9IDE So if we could fix it there, it would be quick and fantastic! https://ide.c9.io/amanuel2/ng-fourm

The reason was that i mispelled javascript:

<script type="text/javscript" src="assets/dist/vendor.min.js"></script>

It was preety hard to find because, something that simple can completely throw you off!

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM