Question

我正在使用AngularJS处理Web应用程序，并使用Browserify将我的JS文件捆绑到一个包中以便在页面中使用。目前我的结构是这样的：

app
|-index.html
|-index.js
|-bundle.js
|-components
  |-module1
    |-index.js
    |-module1.directive.js
    |-module1.html

因为捆绑的javascript文件最终出现在app文件夹中，我的指令最终看起来像这样：

module.exports = angular.module('module1.directive', [])
    .directive('moduleDirective', function() {
        return {
            restrict: 'E',
            templateUrl: './components/module1/module1.html'
        );
    });

这一般来说运作得很好，但是如果项目在更多开发人员参与之后变得足够复杂，那么这条路可能会变得相当长，并且当他们以这种方式定义指令时更难以移动指令（更改templateUrl路径是一个相对容易忘记的额外步骤。）

我想知道的是，有没有办法让我在templateUrl中使用相对路径，以便Browserify能够在捆绑文件时正确解析它？

编辑：如果有帮助的话，如果我能找到一种方法来获取被捆绑在模块内部的脚本的ORIGINAL文件路径，我可以完成这项工作，但是我不知道Browserify是否支持。

Answer 1

pathmodify插件可以解决您的问题吗？更多信息可以在github上找到（https://github.com/jmm/pathmodify）

var pathmodify = require('pathmodify');
browserify()
     .plugin(pathmodify(), {mods: [
        // Make code like `require('app/something')` act like
        // `require('/somedir/src/something')`
        pathmodify.mod.dir('app', '/somedir/src')
]})

在与Browserify捆绑时，是否可以在AngularJS中使用指令templateUrls的相对路径？

1 个答案: