Question

我正在开发一个WebGL库，我想将其作为依赖项导入到EmberJS项目中。除非我弄错了，否则我相信我可以通过存储库直接执行此操作，而无需制作npm包，但我无法使其工作。

我已经分别在一些repos here和here中制作了一个淡化库和ember项目来演示我的问题。

如果您克隆库并运行npm run build，它将生成一个测试包，可以通过测试html文件packageTest.html调用。它应打印出“Hello World Test Member：5＆＃39;。

”

在Ember项目中，我有一个组件，我想在其中导入＆＃39; HelloWorld＆＃39;来自库的类并调用其成员方法之一。

import Ember from 'ember';
//import HelloWorld from 'npm-package-test';
export default Ember.Component.extend({
  isWide: false,
  actions: {
    toggleImageSize() {
      // var h = new HelloWorld();
      // console.log(h.print());
      this.toggleProperty('isWide');
    }
  }
});

当我取消注释import语句时，我收到控制台错误

Error: Could not find module 'npm-package-test'

我对npm包装以及依赖关系的工作方式仍然很陌生（并且对Ember几乎一无所知）但是从我有限的理解来看，我觉得这种方法应该像我现在的方式一样。

对于库，我将源文件保存到其lib文件夹中的ES5中。正如你在下面的库的package.json中看到的那样，我将main设置为lib文件夹中的索引文件，以便Ember项目可以拉出被禁用的模块。

图书馆：package.json

{
  "name": "npm-package-test",
  "version": "1.0.0",
  "description": "JibJab Render Library for eCards",
  "main": "lib/index.js",
  "scripts": {
    "prepublishOnly": "npm run build",
    "build-test": "browserify test.js > demo/testbundle.js",
    "build": "babel ./src -d ./lib && npm run build-test",
    "lint": "eslint ./src",
    "test": "nyc mocha --require babel-core/register"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/nhoughto5/NPM_PackageTest.git"
  },
  "author": "JibJab",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/nhoughto5/NPM_PackageTest/issues"
  },
  "homepage": "https://github.com/nhoughto5/NPM_PackageTeste#readme",
  "devDependencies": {
    "babel-cli": "6.26.0",
    "babel-preset-env": "1.6.1",
    "eslint": "4.19.0",
    "mocha": "5.0.4",
    "nyc": "11.6.0"
  },
  "nyc": {
    "reporter": [
      "lcov",
      "text"
    ]
  },
  "dependencies": {
    "domready": "^1.0.8"
  }
}

作为参考，这里是lib / index.js，它应该是我的库的入口点：

图书馆：lib / index.js

'use strict';

module.exports = {
  TestClass: require('./TestClass'),
  HelloWorld: require('./HelloWorld')
};

在ember项目中，我将库存储库列为依赖项：

Ember：package.json

{
  "name": "test-ember-app",
  "version": "0.0.0",
  "description": "Small description for test-ember-app goes here",
  "license": "MIT",
  "author": "",
  "directories": {
    "doc": "doc",
    "test": "tests"
  },
  "repository": "",
  "scripts": {
    "build": "ember build",
    "start": "ember server",
    "test": "ember test"
  },
  "devDependencies": {
    "broccoli-asset-rev": "^2.4.5",
    "ember-ajax": "^3.0.0",
    "ember-browserify": "1.2.1",
    "ember-cli": "2.13.1",
    "ember-cli-app-version": "^3.0.0",
    "ember-cli-babel": "^6.0.0",
    "ember-cli-dependency-checker": "^1.3.0",
    "ember-cli-eslint": "^3.0.0",
    "ember-cli-htmlbars": "^1.1.1",
    "ember-cli-htmlbars-inline-precompile": "^0.4.0",
    "ember-cli-inject-live-reload": "^1.4.1",
    "ember-cli-mirage": "0.4.3",
    "ember-cli-qunit": "^4.0.0",
    "ember-cli-shims": "^1.1.0",
    "ember-cli-sri": "^2.1.0",
    "ember-cli-tutorial-style": "2.0.0",
    "ember-cli-uglify": "^1.2.0",
    "ember-data": "^2.13.0",
    "ember-export-application-global": "^2.0.0",
    "ember-load-initializers": "^1.0.0",
    "ember-resolver": "^4.0.0",
    "ember-source": "~2.13.0",
    "ember-welcome-page": "^3.0.0",
    "loader.js": "^4.2.3"
  },
  "engines": {
    "node": ">= 4"
  },
  "private": true,
  "dependencies": {
    "npm-package-test": "git+https://github.com/nhoughto5/NPM_PackageTest.git"
  }
}

当我在ember项目中运行npm install时，我可以看到库中的文件夹结构显示在node_modules文件夹中。根据我有限的经验，一切似乎都是正确的，但由于某种原因，我仍然得到这个未定义的模块错误。

我错过了一个步骤或者我错过了一些重要细节吗？

Answer 1

是的，你仍然缺少一步。要让Ember-CLI了解您要将npm软件包包含在应用程序的供应商文件中，您需要使用<div class="sc_schedule_button"> <a href="#">Register</a> </div> <div class="sc_schedule_button"> <a href="url">Login</a> </div>，如下所示：https://guides.emberjs.com/v3.0.0/addons-and-dependencies/managing-dependencies/

自Ember-CLI 2.15以来，app.import的方法已存在，但如果您使用的是旧版本，则需要先升级。

无法将自定义库从存储库导入Ember项目作为依赖项

1 个答案: