Question

我是Web应用程序的新手并开始学习AngularJS，因为我需要将它用于项目。我已将文件夹结构设置为

Folder
  |
   app
      |
       home
      |    |
      |    views -> home.html
      |    module.js
      |
       app.scripts.json(this is a file)
       bower_components(this is a folder)
       gulpfile.js
       index.html

app.scripts.json有

{
  "chunks": {
    "vendor": [
      "angular"    
    ]
  },
  "paths": {
    "angular": "bower_components/angular/angular.min.js"
  }
}

bower_components已安装所有文件和文件夹。

index.html已

<!DOCTYPE html>
   <html lang="en-us" class="no-js">

   <head>    
      <meta charset="utf-8">   
   </head>  

  <body >       
       <script src="build/app.js"></script>    
  </body>

</html>

module.js有

"use strict";
angular.module('app.home', ['ui.router'])
       .config(function ($stateProvider) {

          $stateProvider
            .state('app.home', {
                url: '/home',
                data: {
                    title: 'Blank'
                },
                views: {
                    "content@app": {
                        templateUrl: 'app/home/views/home.html',
                        controller: 'HomeCtrl'
                    }
                }
            })
       });

我的gulpfile.js有

///////////////////////////////////////////
///Required
///////////////////////////////////////////
var es = require('event-stream');
var gulp = require('gulp');
var concat = require('gulp-concat');
var connect = require('gulp-connect');
var templateCache = require('gulp-angular-templatecache');
var ngAnnotate = require('gulp-ng-annotate');
var uglify = require('gulp-uglify');
var fs = require('fs');
var _ = require('lodash');

///////////////////////////////////////////
///Scripts task
///////////////////////////////////////////
var scripts = require('./app.scripts.json');
gulp.task('vendor', function(){
    _.forIn(scripts.chunks, function(chunkScripts, chunkName){
        var paths = [];
        chunkScripts.forEach(function(script){
            var scriptFileName = scripts.paths[script];

            if (!fs.existsSync(__dirname + '/' + scriptFileName)) {

                throw console.error('Required path doesn\'t exist: ' + __dirname + '/' + scriptFileName, script)
            }
            paths.push(scriptFileName);
        });
        gulp.src(paths)
            .pipe(concat(chunkName + '.js'))
            //.on('error', swallowError)
            .pipe(gulp.dest(destinations.js))
    })

});

var source = {
    js: {
        main: 'app/main.js',
        src: [
              'app/main.js',
              // module files
              'app/**/module.js',
              // other js files [controllers, services, etc.]
              'app/**/!(module)*.js'




        ]
    }
};

var destinations = {
    js: 'build'
};


gulp.task('build', function(){
    return es.merge(gulp.src(source.js.src) )
         .pipe(ngAnnotate())
         .pipe(uglify())
         .pipe(concat('app.js'))
         .pipe(gulp.dest(destinations.js));
});

gulp.task('scripts', function(){
    return es.merge(gulp.src(source.js.src) )
        .pipe(concat('app.js'))
        .pipe(gulp.dest(destinations.js));
});


///////////////////////////////////////////
///Default task
///////////////////////////////////////////
gulp.task('default', ['vendor', 'build']);"use strict";
angular.module('app.home', ['ui.router'])
       .config(function ($stateProvider) {

          $stateProvider
            .state('app.home', {
                url: '/home',
                data: {
                    title: 'Blank'
                },
                views: {
                    "content@app": {
                        templateUrl: 'app/home/views/home.html',
                        controller: 'HomeCtrl'
                    }
                }
            })
       });

运行gulp后，我在build文件夹中有app.js，它只有两行

"use strict";$.sound_path=appConfig.sound_path,$.sound_on=appConfig.sound_on,$(function(){moment.locale("en"),angular.bootstrap(document,["app"])});
"use strict";angular.module("app.home",["ui.router"]).config(["$stateProvider",function(e){e.state("app.home",{url:"/home",data:{title:"Blank"},views:{"content@app":{templateUrl:"app/home/views/home.html",controller:"HomeCtrl"}}})}]);

它不显示home.html内的内容。我的问题是什么，以便不显示home.html？

AngularJS的模型视图控制器设置

0 个答案: