.NET Angular 使用 RequireJS

.NET Angular using RequireJS

我在 Visual Studios 2013 中创建了一个新的 ASP.NET 空 Web 应用程序。我有一个具有以下目录结构的 angular 项目:

├───TestProject
│   ├───index.html
│   ├───package.json
│   ├───Web.config
│   ├───app
│   │   ├───app.module.js
│   │   ├───main.js
│   ├───bin
│   ├───node_modules
│   │   ├───google-distance
│   │   │   └───test
│   │   ├───json-stringify-safe
│   │   │   └───test
│   │   ├───qs
│   │   ├───request
│   │   │   └───lib
│   ├───obj
│   │   └───Debug
│   │       └───TempPE
│   ├───Properties
│   └───Scripts
└───packages
    ├───angularjs.1.6.1
    │   └───content
    │       └───Scripts
    │           └───i18n
    │               └───ngLocale
    ├───AngularJS.Core.1.6.1
    │   └───content
    │       └───Scripts
    └───RequireJS.2.3.2
        └───content
            └───Scripts

这是我的 packages.json 的样子:

{
  "name": "google-distance",
  "version": "1.0.1",
  "main": "index",
  "description": "A simple node.js wrapper for Google's Distance Matrix API",
  "author": {
    "name": "Edward Look",
    "email": "edwlook@gmail.com",
    "url": "http://edwardlook.com"
  },
  "license": "MIT",
  "repository": {
    "type": "git",
    "url": "https://github.com/edwlook/node-google-distance.git"
  },
  "keywords": [
    "google",
    "maps",
    "distance",
    "matrix",
    "api"
  ],
  "dependencies": {
    "google-distance": "~1.0.1"
  }
}

I 运行 npm install 并创建了 node_modules 文件夹。在我的 main.js 文件的顶部,我有:

var distance = require('../node_modules/google-distance/index.js');

但每次我加载页面时,控制台都会显示:

require.js:168 Uncaught Error: Module name "../node_modules/google-distance/index.js" has not been loaded yet for context: _. Use require([])
http://requirejs.org/docs/errors.html#notloaded
    at makeError (require.js:168)
    at Object.localRequire [as require] (require.js:1433)
    at requirejs (require.js:1794)
    at main.js:2

我做错了什么?如何使用 google-距离模块?

通常你应该要求它如下;

var distance = require('google-distance');

节点查找模块的方式如下; 它将通过以下方式对 "node_modules" 和 "google-distance" 执行分层目录搜索:

  • ./node_modules/google-distance.js
  • ./node_modules/google-distance/index.js
  • ./node_modules/google-distance/package.json

此外,您似乎应该使用 require 的异步回调版本来加载此库。

require(['google-distance'], function (distance) {
    //package is now loaded.
});

来自需求常见问题解答:

MODULE NAME ... HAS NOT BEEN LOADED YET FOR CONTEXT: ... This occurs when there is a require('name') call, but the 'name' module has not been loaded yet. If the error message includes Use require([]), then it was a top-level require call (not a require call inside a define() call) that should be using the async, callback version of require to load the code.

http://requirejs.org/docs/errors.html#notloaded