grunt bower安裝不起作用

Question

我正在創建一個新的AngularJS項目（第一次爲我），我覺得它非常敏感......最新的問題是獲取涼亭正確配置我的index.html文件中的東西。

如果我只是將事情硬編碼到googleapis，它都可以正常工作（例如在index.html文件中）。

如果我安裝了bower並做了一個grunt bowerInstall，它增加了什麼看起來是我的index.html中的正確行，但它們根本不起作用。我得到這樣的錯誤：

Resource interpreted as Script but transferred with MIME type text/html: "http://localhost:8081/bower_components/angular/angular.js". 

和 Uncaught SyntaxError: Unexpected token <的角度文件。

到目前爲止，涼亭一直是皇室的痛苦......任何想法這裏怎麼了？謝謝！

順便說一句，簡單的應用程序工作正常，我已經得到了一些基本的業力測試工作。

bower.json：

{ 
    "name": "meanjs_book", 
    "version": "0.1.0", 
    "homepage": "https://github.com/JESii/xxx", 
    "authors": [ 
    "Jon Seidel <jseidel@edpci.com>" 
    ], 
    "description": "Rudimentary app from MeanJS Book", 
    "main": "server.js", 
    "moduleType": [ 
    "node" 
    ], 
    "keywords": [ 
    "MongoDB", 
    "Express", 
    "AngularJS", 
    "Node", 
    "HighPlans" 
    ], 
    "license": "MIT", 
    "private": true, 
    "ignore": [ 
    "**/.*", 
    "node_modules", 
    "bower_components", 
    "test", 
    "tests", 
    "spec" 
    ], 
    "dependencies": { 
    "angular-route": "~1.3.15", 
    "angular": "~1.3.15", 
    "angular-animate": "~1.3.15", 
    "angular-mocks": "~1.3.15" 
    } 
} 

Gruntfile

module.exports = function(grunt) { 

    // Project configuration. 
    grunt.initConfig({ 
    pkg: grunt.file.readJSON('package.json'), 
    uglify: { 
     options: { 
     banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n' 
     }, 
     build: { 
     src: 'src/<%= pkg.name %>.js', 
     dest: 'build/<%= pkg.name %>.min.js' 
     } 
    }, 
    bowerInstall: { 

     target: { 

     // Point to the files that should be updated when 
     // you run `grunt bowerInstall` 
     src: ['public/app/views/index.html'], // index.html support 

      // Optional: 
      // --------- 
      cwd: '', 
      dependencies: true, 
      devDependencies: false, 
      exclude: [], 
      fileTypes: {}, 
      ignorePath: '', 
      overrides: {} 
     } 
    } 
    }); 

    // Load the plugin that provides the "uglify" task. 
    grunt.loadNpmTasks('grunt-contrib-uglify'); 

    // Default task(s). 
    grunt.registerTask('default', ['uglify']); 

    grunt.loadNpmTasks('grunt-bower-install'); 
}; 

的index.html：

<!-- AngularJS --> 
&lt;script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js" type="text/javascript" charset="utf-8">&lt;/script> 
&lt;script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-route.js" type="text/javascript" charset="utf-8">&lt;/script> 
&lt;script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.js" type="text/javascript" charset="utf-8">&lt;/script> 
&lt;script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-mocks.js" type="text/javascript" charset="utf-8">&lt;/script> 

<!-- bower:js --> 
<!-- &lt;script src="../../../bower_components/angular/angular.js" type="text/javascript">&lt;/script> --> 
<!-- &lt;script src="../../../bower_components/angular&#45;route/angular&#45;route.js" type="text/javascript">&lt;/script> --> 
<!-- &lt;script src="../../../bower_components/angular&#45;animate/angular&#45;animate.js" type="text/javascript">&lt;/script> --> 

</s的cript> - >

Answer 1

我假設您在運行grunt serve時遇到錯誤。您粘貼的控制檯消息表明grunt不允許JS文件通過。如果某個特定的文件類型不被允許，它將被index.html取代，這就是爲什麼它使用MIME類型HTML傳輸的原因。你從哪裏得到Gruntfile？

此外，我建議使用Yeoman腳手架基本的Angular應用程序。看看這裏：http://yeoman.io/codelab.html。這是非常容易遵循，並會讓你更喜歡使用像Grunt & Bower這樣的工具。