我可以改变在自耕农角应用程序中使用的凉亭时，走什么路被呈现？ [英] Can I change what path gets rendered when using bower in an yeoman angular app?

问题描述

我使用html5mode在我的角度的应用程序，但是当我运行亭子安装与咕噜，它呈现路径，

I am using html5mode in my angular app, but when I run bower install with grunt, it renders the paths as

＆LT;脚本SRC =bower_components /...

我可以改变这

＆LT;脚本的src =/ bower_components /...

我添加了一个＆LT;基本href =/＆GT; 标签来我＆LT;头/＆GT; 部分，但是当我的网页尝试加载javascript中，他们仍在寻找相对URL。

I've added a <base href="/"> tag to my <head/> section, but when my pages try to load javascript, they are still looking for relative urls.

所以脚本在 /bower_components/script.js ，目前呈现为
＆LT;脚本SRC =bower_components /的script.js＆GT;＆LT; / SCRIPT＆GT; ，

So for a script at /bower_components/script.js, currently rendered as <script src="bower_components/script.js"></script>,

/login/bower_components/script.js

修改
继@ sharpper的建议，我在Gruntfile.js增加了code座的下方，结束了这一点：

EDIT Following @sharpper's advice, I added the code block below and ended up with this in Gruntfile.js:

// Automatically inject Bower components into the app
'bower-install': {
  app: {
    html: '<%= yeoman.app %>/index.html',
    ignorePath: '<%= yeoman.app %>/',
    fileTypes: {
      html: {
        block: /(([\s\t]*)<!--\s*bower:*(\S*)\s*-->)(\n|\r|.)*?(<!--\s*endbower\s*-->)/gi,
        detect: {
          js: /<script.*src=['"](.+)['"]>/gi,
          css: /<link.*href=['"](.+)['"]/gi
        },
        replace: {
          js: '<script src="/{{filePath}}"></script>', // <-- Change this line
          css: '<link rel="/stylesheet" href="{{filePath}}" />'
        }
      },
      yml: {
        block: /(([\s\t]*)#\s*bower:*(\S*)\s*)(\n|\r|.)*?(#\s*endbower\s*)/gi,
        detect: {
          js: /-\s(.+)/gi,
          css: /-\s(.+)/gi
        },
        replace: {
          js: '- {{filePath}}',
          css: '- {{filePath}}'
        }
      }
    }
  }
},

它仍然编译正确，但文件呈现相同的。

It still compiles correctly, but the files are rendered the same.

推荐答案

首先，请确保您的凉亭安装在最新版本：v0.8.0（自耕农是使用目前v0.7.0），那么code以下应工作：

Firstly, make sure your bower-install at the latest version: v0.8.0 (yeoman is using v0.7.0 currently), then the code below should work:

     'bower-install': {
         app: {
            src: ['<%= yeoman.app %>/index.html'],
            ignorePath: '<%= yeoman.app %>/',
            fileTypes: {
                html: {
                    replace: {
                        js: '<script src="/{{filePath}}"></script>',
                        css: '<link rel="stylesheet" href="/{{filePath}}" />'
                    }
                }
            }
        }
     }

如果您不希望更新或此方法不起作用，试试这招：
       更改 ignorePath：'＆LT;％= yeoman.app％GT; /'，到 ignorePath：'＆LT;％= yeoman.app％GT; ，那么它应该适用于你的目的。

If you don't want to update or this method does not work, try this trick: Change ignorePath: '<%= yeoman.app %>/', to ignorePath: '<%= yeoman.app %>', , then it should work for your purpose.

这篇关于我可以改变在自耕农角应用程序中使用的凉亭时，走什么路被呈现？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！