browserify-shim找不到模块

时间:2014-02-21 03:26:03

标签: browserify

鉴于以下内容:

main.js

var angular = require('angular');

的package.json

{
  "main": "./main.js",
  "browser": {
    "angular": "./vendor/angular/angular.js"
  },
  "browserify-shim": {
    "angular": "angular"
  },
  "browserify": {
    "transform": [ "browserify-shim" ]
  },
  "dependencies": {
    "browserify-shim": "~3.2.0"
  }
}

运行时:

browserify . -d -o bundle.js

已成功创建捆绑包,并且browserify-shim诊断程序的输出为:

{
  file: 'D:\\development\\js\\browserify\\main.js',
  info:
  {
    package_json: 'D:\\development\\js\\browserify\\package.json',
    packageDir: 'D:\\development\\js\\browserify',
    shim: undefined,
    exposeGlobals:
    {},
    browser:
    {
      angular: './vendor/angular/angular.js'
    },
    'browserify-shim':
    {
      angular: 'angular'
    },
    dependencies:
    {
      'browserify-shim': '~3.2.0'
    },
    lookedUp: false
  },
  messages: ['Found "angular" in browser field referencing "./vendor/angular/angular.js" and resolved it to "D:\\development\\js\\browserify\\vendor\\angular\\angular.js"',
  {
    resolved:
    {
      'D:\\development\\js\\browserify\\vendor\\angular\\angular.js':
      {
        exports: 'angular',
        depends: undefined
      }
    }
  }]
}

{
  file: 'D:\\development\\js\\browserify\\vendor\\angular\\angular.js',
  info:
  {
    package_json: 'D:\\development\\js\\browserify\\package.json',
    packageDir: 'D:\\development\\js\\browserify\\',
    shim:
    {
      exports: 'angular',
      depends: undefined
    },
    exposeGlobals:
    {},
    browser:
    {
      angular: './vendor/angular/angular.js'
    },
    'browserify-shim':
    {
      angular: 'angular'
    },
    dependencies:
    {
      'browserify-shim': '~3.2.0'
    },
    lookedUp: false
  },
  messages: ['Found "angular" in browser field referencing "./vendor/angular/angular.js" and resolved it to "D:\\development\\js\\browserify\\vendor\\angular\\angular.js"',
  {
    resolved:
    {
      'D:\\development\\js\\browserify\\vendor\\angular\\angular.js':
      {
        exports: 'angular',
        depends: undefined
      }
    }
  }]
}

如果将package.json更改为此(删除浏览器部分):

{
  "main": "./main.js",
  "browserify-shim": {
    "./vendor/angular/angular.js": "angular"
  },
  "browserify": {
    "transform": [ "browserify-shim" ]
  },
  "dependencies": {
    "browserify-shim": "~3.2.0"
  }
}

我收到以下错误:

Error: module "angular" not found from "D:\\development\\js\\browserify\\main.js"

使用browserify-shim诊断程序的输出:

{
  file: 'D:\\development\\js\\browserify\\main.js',
  info:
  {
    package_json: 'D:\\development\\js\\browserify\\package.json',
    packageDir: 'D:\\development\\js\\browserify',
    shim: undefined,
    exposeGlobals:
    {},
    browser: undefined,
    'browserify-shim':
    {
      './vendor/angular/angular.js': 'angular'
    },
    dependencies:
    {
      'browserify-shim': '~3.2.0'
    },
    lookedUp: false
  },
  messages: ['Resolved "./vendor/angular/angular.js" found in package.json to "D:\\development\\js\\browserify\\vendor\\angular\\angular.js"',
  {
    resolved:
    {
      'D:\\development\\js\\browserify\\vendor\\angular\\angular.js':
      {
        exports: 'angular',
        depends: undefined
      }
    }
  }]
}
{
  [Error: module "angular"
    not found from "D:\\development\\js\\browserify\\main.js"
  ]
  filename: 'angular',
  parent: 'D:\\development\\js\\browserify\\main.js'
}

我的印象是浏览器部分用于配置别名,并且上面的两个不同的package.json文件应该是等效的。

我误解了吗?

1 个答案:

答案 0 :(得分:7)

来自作者:

如果您不通过浏览器字段将./vendor/angular/angular.js别名为angular,则browserify不知道在何处找到它。

因此,如果您省略浏览器字段别名,请执行以下操作:

  

var angular = require(' ./ vendor / angular / angular.js');

(假设./vendor/angular/angular.js与您要求的相对)