2013-12-18 1 views
3

내 프로젝트를 만들 때 generator-angles을 사용했습니다.그루트 연결 modrewrite 작동하지 않습니다

HTML5 기록을 사용합니다. ($ locationProvider.html5Mode (참) .hashPrefix() '!') URL 재 작성을 위해

내가 connect-modrewrite

을 사용 나는 튜토리얼에 설명 된 모든 등을했다.

은 여기 내 GruntFile.js 내가 뭘 잘못했는지

// Generated on 2013-12-13 using generator-angular 0.6.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' 

var proxySnippet = require('grunt-connect-proxy/lib/utils').proxyRequest; 
var modRewrite = require('connect-modrewrite'); 

module.exports = function (grunt) { 

    // Load grunt tasks automatically 
    require('load-grunt-tasks')(grunt); 

    // Time how long tasks take. Can help when optimizing build times 
    require('time-grunt')(grunt); 

    // proxy for backend 
    grunt.loadNpmTasks('grunt-connect-proxy'); 

    // lib for run rales server 
    grunt.loadNpmTasks('grunt-exec'); 

    // Define the configuration for all the tasks 
    grunt.initConfig({ 

    // Project settings 
    yeoman: { 
     // configurable paths 
     app: require('./bower.json').appPath || 'app', 
     dist: 'dist' 
    }, 

    // Watches files for changes and runs tasks based on the changed files 
    watch: { 
     js: { 
     files: ['{.tmp,<%= yeoman.app %>}/scripts/{,*/}*.js'], 
     tasks: ['newer:jshint:all'] 
     }, 
     jsTest: { 
     files: ['test/spec/{,*/}*.js'], 
     tasks: ['newer:jshint:test', 'karma'] 
     }, 
     compass: { 
     files: ['<%= yeoman.app %>/styles/{,*/}*.{scss,sass}'], 
     tasks: ['compass:server', 'autoprefixer'] 
     }, 
     styles: { 
     files: ['<%= yeoman.app %>/styles/{,*/}*.css'], 
     tasks: ['newer:copy:styles', 'autoprefixer'] 
     }, 
     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: 80, 
     // Change this to '0.0.0.0' to access the server from outside. 
     hostname: 'localhost', 
     livereload: 35729 
     }, 
     livereload: { 
     options: { 
      open: true, 
      base: [ 
      '.tmp', 
      '<%= yeoman.app %>' 
      ], 
      middleware: function (connect, options) { 
      var middlewares = []; 
      options.base.forEach(function(base) { 
       // Serve static files. 
       middlewares.push(connect.static(base)); 
      }); 
      middlewares.push(proxySnippet); 
      middlewares.push(modRewrite([ 
       '^/offers$ /index.html', 
       '!\\.html|\\.js|\\.css|\\woff|\\ttf|\\swf$ /index.html' 
      ])); 
      return middlewares; 
      } 
     } 
     }, 
     test: { 
     options: { 
      port: 9001, 
      base: [ 
      '.tmp', 
      'test', 
      '<%= yeoman.app %>' 
      ] 
     } 
     }, 
     dist: { 
     options: { 
      base: '<%= yeoman.dist %>' 
     } 
     }, 
     proxies: [ 
     { 
      context: '/api', 
      host: 'localhost', 
      port: 8080, 
      https: false, 
      changeOrigin: true, 
      xforward: true, 
      rewrite: { 
      '^/api': '' 
      } 
     } 
     ] 
    }, 

    exec: { 
     rales: { 
     // here I use code for run backend 
     } 
    }, 

    // Make sure code styles are up to par and there are no obvious mistakes 
    jshint: { 
     options: { 
     jshintrc: '.jshintrc', 
     reporter: require('jshint-stylish') 
     }, 
     all: [ 
     'Gruntfile.js', 
     '<%= yeoman.app %>/scripts/{,*/}*.js' 
     ], 
     test: { 
     options: { 
      jshintrc: 'test/.jshintrc' 
     }, 
     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 
    autoprefixer: { 
     options: { 
     browsers: ['last 1 version'] 
     }, 
     dist: { 
     files: [{ 
      expand: true, 
      cwd: '.tmp/styles/', 
      src: '{,*/}*.css', 
      dest: '.tmp/styles/' 
     }] 
     } 
    }, 




    // Compiles Sass to CSS and generates necessary files if requested 
    compass: { 
     options: { 
     sassDir: '<%= yeoman.app %>/styles', 
     cssDir: '.tmp/styles', 
     generatedImagesDir: '.tmp/images/generated', 
     imagesDir: '<%= yeoman.app %>/images', 
     javascriptsDir: '<%= yeoman.app %>/scripts', 
     fontsDir: '<%= yeoman.app %>/styles/fonts', 
     importPath: '<%= yeoman.app %>/bower_components', 
     httpImagesPath: '/images', 
     httpGeneratedImagesPath: '/images/generated', 
     httpFontsPath: '/styles/fonts', 
     relativeAssets: false, 
     assetCacheBuster: false 
     }, 
     dist: { 
     options: { 
      generatedImagesDir: '<%= yeoman.dist %>/images/generated' 
     } 
     }, 
     server: { 
     options: { 
      debugInfo: true 
     } 
     } 
    }, 

    // Renames files for browser caching purposes 
    rev: { 
     dist: { 
     files: { 
      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 %>' 
     } 
    }, 

    // Performs rewrites based on rev and the useminPrepare configuration 
    usemin: { 
     html: ['<%= yeoman.dist %>/{,*/}*.html'], 
     css: ['<%= yeoman.dist %>/styles/{,*/}*.css'], 
     options: { 
     assetsDirs: ['<%= yeoman.dist %>'] 
     } 
    }, 

    // The following *-min tasks produce minified files in the dist folder 
    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: { 
      // Optional configurations that you can uncomment to use 
      // removeCommentsFromCDATA: true, 
      // collapseBooleanAttributes: true, 
      // removeAttributeQuotes: true, 
      // removeRedundantAttributes: true, 
      // useShortDoctype: true, 
      // removeEmptyAttributes: true, 
      // removeOptionalTags: true*/ 
     }, 
     files: [{ 
      expand: true, 
      cwd: '<%= yeoman.app %>', 
      src: ['*.html', 'views/*.html'], 
      dest: '<%= yeoman.dist %>' 
     }] 
     } 
    }, 

    // Allow the use of non-minsafe AngularJS files. Automatically makes it 
    // minsafe compatible so Uglify does not destroy the ng references 
    ngmin: { 
     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}', 
      '.htaccess', 
      'bower_components/**/*', 
      'images/{,*/}*.{webp}', 
      'fonts/*' 
      ] 
     }, { 
      expand: true, 
      cwd: '.tmp/images', 
      dest: '<%= yeoman.dist %>/images', 
      src: [ 
      'generated/*' 
      ] 
     }] 
     }, 
     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: [ 
     'compass:server', 
     'copy:styles' 
     ], 
     test: [ 
     'compass', 
     'copy:styles' 
     ], 
     dist: [ 
     'compass:dist', 
     'copy:styles', 
     'imagemin', 
     'svgmin', 
     'htmlmin' 
     ] 
    }, 

    // 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', 
    //   '<%= yeoman.app %>/styles/{,*/}*.css' 
    //  ] 
    //  } 
    // } 
    // }, 
    // uglify: { 
    // dist: { 
    //  files: { 
    //  '<%= yeoman.dist %>/scripts/scripts.js': [ 
    //   '<%= yeoman.dist %>/scripts/scripts.js' 
    //  ] 
    //  } 
    // } 
    // }, 
    // concat: { 
    // dist: {} 
    // }, 

    // Test settings 
    karma: { 
     unit: { 
     configFile: 'karma.conf.js', 
     singleRun: true 
     } 
    } 
    }); 


    grunt.registerTask('serve', function (target) { 
    if (target === 'dist') { 
     return grunt.task.run(['build', 'connect:dist:keepalive']); 
    } 

    grunt.task.run([ 
     'clean:server', 
     'concurrent:server', 
     'autoprefixer', 
     'configureProxies', 
     'connect:livereload', 
     'watch' 
    ]); 
    }); 

    grunt.registerTask('unicorn', [ 
     'exec:rales' 
    ]); 

    grunt.registerTask('server', function() { 
    grunt.log.warn('The `server` task has been deprecated. Use `grunt serve` to start a server.'); 
    grunt.task.run(['serve']); 
    }); 

    grunt.registerTask('test', [ 
    'clean:server', 
    'concurrent:test', 
    'autoprefixer', 
    'connect:test', 
    'karma' 
    ]); 

    grunt.registerTask('build', [ 
    'clean:dist', 
    'useminPrepare', 
    'concurrent:dist', 
    'autoprefixer', 
    'concat', 
    'ngmin', 
    'copy:dist', 
    'cdnify', 
    'cssmin', 
    'uglify', 
    'rev', 
    'usemin' 
    ]); 

    grunt.registerTask('default', [ 
    'newer:jshint', 
    'test', 
    'build' 
    ]); 
}; 

입니까? 브라우저에서 페이지를 새로 고침 할 때 "얻을 수 없거나 제공 할 수 없습니다."

답변

7

grunt-connect-proxy 및 connect-modrewrite로 문제가 발생했습니다.

 middleware: function (connect, options) { 
     var middlewares = []; 

     middlewares.push(modRewrite([ 
      '!/api|/assets|\\.html|\\.js|\\.css|\\woff|\\ttf|\\swf$ /index.html' 
     ])); 
     options.base.forEach(function (base) { 
      // Serve static files. 
      middlewares.push(connect.static(base)); 
     }); 
     middlewares.push(proxySnippet); 
     return middlewares; 
     } 

내가 proxySnippet (꿀꿀 - 연결 - 프록시) 후 미들웨어에 modRewrite을 누르면 - 작동하지 않는 연결-modrewrite. 나는 모든 꿀꿀 - 연결 - 프록시 상황 (/ API/자산) 전에 modRewrite을 넣어 제외하기로 결정하고 모두가 잘 작동 될 :)

은 어떤 하나 :)

+3

그것은 나를 위해 유용 유용 할 것입니다 희망 . 고맙습니다. 한 가지만 이미지가 처리되지 않으므로 middlewares.push (modRewrite ([ '!/api |/assets | \\. png | \\. jpeg | \\. gif | \\. html) 코드를 수정했습니다. | \\. js | \\. css | \\ woff | \\ ttf | \\ swf $ /index.html ' ])); –

+0

여기서 더 자세한 내용을 읽을 수 있습니다 http://ericduran.io/2013/05/31/angular-html5Mode-with-yeoman/ – STEEL

+0

최신 버전에서는'TypeError : undefined is not a function' 코드를 얻습니다. connect.static', 나는 이것이 다른 프로젝트로 옮겨 졌다고 생각하지만, 그것을 버리는 방법을 알아낼 수 없다. – frazras