使用Grunt在HTML中插入Bower devdependencies

Question

我通过Yeoman脚手架安装了AngularJS。当我运行

grunt bower-install

时，它只会在HTML中引用bower.json中“dependencies”部分中的依赖项。如何让它包括“devDependencies”部分中的依赖项？

- Nico Rodsevich

---

可能是重复的问题Bower和devDependencies与dependencies的区别。 - montecruiseto

你会在这里找到你需要了解的一切，以及更多。 - montecruiseto

我之前看过那篇帖子，但它没有解释如何让Grunt在开发应用程序时安装依赖项。 - Nico Rodsevich

Answer 1

根据Angular更改日志，版本9.0.0中已弃用bower-install任务 参见此处，现在应使用wiredep代替。请按以下方式编辑Gruntfile.js文件：

wiredep: {
  options: {
    cwd: '<%= yeoman.app %>'
  },
  dev: {
    devDependencies: true,
    src: ['<%= yeoman.app %>/index.html'],
    ignorePath:  /\.\.\//
  },
  app: {
    src: ['<%= yeoman.app %>/index.html'],
    ignorePath:  /\.\.\//
  },
  sass: {
    src: ['<%= yeoman.app %>/styles/{,*/}*.{scss,sass}'],
    ignorePath: /(\.\.\/){1,2}bower_components\//
  }
},

现在使用以下命令安装 DevDependencies

grunt wiredep:dev

- Nico Rodsevich

Answer 2

显然，我需要50个声望才能对被接受的答案进行评论，所以我不得不在此添加一些内容，以便将来遇到这个线程的任何人，被接受的答案中的更改对我有用，但是我还必须进一步更改gruntfile.js中的另一行代码

grunt.registerTask('serve', 'Compile then start a connect web server', function (target) {
    ...

    grunt.task.run([
      'clean:server',
      'wiredep:dev', <-- Changed this from plain 'wiredep'
      'concurrent:server',
      'autoprefixer',
      'connect:livereload',
      'watch'
    ]);
  });

- skolsuper

Answer 3

如果你正确地构建了 Yeoman 生成器（在日志中检查错误），那么所有的依赖项都应该已经安装好了，包括在 "devDependencies" 下列出的那些。如果还不行，请删除整个 bower_components 文件夹，确保你的 bower.json 中没有语法错误，然后重新运行。

bower install

在你的根目录下执行此命令。这将安装所有内容。

- montecruiseto

---

是的，它们已经正确安装了，但没有自动包含在HTML中。 - Nico Rodsevich