angularjs – Angular2 – Angular-CLI安装lodash – 找不到模块

前端之家收集整理的这篇文章主要介绍了angularjs – Angular2 – Angular-CLI安装lodash – 找不到模块前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
Mac OSX El capitan | angular-cli:0.1.0 |节点:5.4.0 | os:darwin x64

我尝试根据angular-cli wiki:https://github.com/angular/angular-cli/wiki/3rd-party-libs安装第三方npm模块但是失败了.我几天来一直在努力解决这个问题,非常感谢任何帮助.

获取错误的步骤:

ng new lodashtest3
cd lodashtest3
npm install lodash –save
typings安装lodash –ambient –save

角-CLI-build.json:

module.exports = function(默认值){
返回新的Angular2App(默认值,{
vendorNpmFiles:[

‘lodash / ** / *.JS’
]
});
};

建立
(lodash在dist / vendor中正确添加)

系统config.ts:

  1. /** Map relative paths to URLs. */
  2. const map: any = {
  3. 'lodash': 'vendor/lodash/lodash.js'
  4. };
  5.  
  6. /** User packages configuration. */
  7. const packages: any = {
  8. 'lodash': {
  9. format: 'cjs'
  10. }
  11. };

(全部按照规范进行
https://github.com/angular/angular-cli/wiki/3rd-party-libs)
注意 – 我已经尝试了我能想到的所有配置设置,都给出了相同的结果.

lodashtest3.component.ts:
从’lodash’导入* as _;

建立

  1. Could not start watchman; falling back to NodeWatcher for file system events.
  2. Visit http://ember-cli.com/user-guide/#watchman for more info.
  3. Build Failed.
  4. The Broccoli Plugin: [BroccoliTypeScriptCompiler] Failed with:
  5. Error: Typescript found the following errors:
  6. /Users/danielmattsson/git/lodashtest3/tmp/broccoli_type_script_compiler-input_base_path-g2lDIaq6.tmp/0/src/app/lodashtest3.component.ts (2,20): Cannot find module 'lodash'.
  7. at BroccoliTypeScriptCompiler._doIncrementalBuild (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/lib/broccoli/broccoli-typescript.js:115:19)
  8. at BroccoliTypeScriptCompiler.build (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/lib/broccoli/broccoli-typescript.js:43:10)
  9. at /Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/broccoli-caching-writer/index.js:152:21
  10. at lib$rsvp$$internal$$tryCatch (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/broccoli-caching-writer/node_modules/rsvp/dist/rsvp.js:1036:16)
  11. at lib$rsvp$$internal$$invokeCallback (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/broccoli-caching-writer/node_modules/rsvp/dist/rsvp.js:1048:17)
  12. at lib$rsvp$$internal$$publish (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/broccoli-caching-writer/node_modules/rsvp/dist/rsvp.js:1019:11)
  13. at lib$rsvp$asap$$flush (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/broccoli-caching-writer/node_modules/rsvp/dist/rsvp.js:1198:9)
  14. at nextTickCallbackWith0Args (node.js:456:9)
  15. at process._tickCallback (node.js:385:13)
  16.  
  17. The broccoli plugin was instantiated at:
  18. at BroccoliTypeScriptCompiler.Plugin (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/broccoli-caching-writer/node_modules/broccoli-plugin/index.js:10:31)
  19. at BroccoliTypeScriptCompiler.CachingWriter [as constructor] (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/broccoli-caching-writer/index.js:21:10)
  20. at BroccoliTypeScriptCompiler (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/lib/broccoli/broccoli-typescript.js:26:49)
  21. at Angular2App._getTsTree (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/lib/broccoli/angular2-app.js:280:18)
  22. at Angular2App._buildTree (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/lib/broccoli/angular2-app.js:101:23)
  23. at new Angular2App (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/lib/broccoli/angular2-app.js:42:23)
  24. at module.exports (/Users/danielmattsson/git/lodashtest3/angular-cli-build.js:6:10)
  25. at Class.module.exports.Task.extend.setupBroccoliBuilder (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/angular-cli/lib/models/builder.js:55:19)
  26. at Class.module.exports.Task.extend.init (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/angular-cli/lib/models/builder.js:89:10)
  27. at new Class (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/angular-cli/node_modules/core-object/core-object.js:18:12)
  28. at Class.module.exports.Task.extend.run (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/angular-cli/lib/tasks/build.js:15:19)
  29. at /Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/angular-cli/lib/commands/build.js:32:24
  30. at lib$rsvp$$internal$$tryCatch (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1036:16)
  31. at lib$rsvp$$internal$$invokeCallback (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1048:17)
  32. at /Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:331:11
  33. at lib$rsvp$asap$$flush (/Users/danielmattsson/git/lodashtest3/node_modules/angular-cli/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1198:9)

编辑:根据下面的评论更多信息

DIST / index.html的:

  1. <!doctype html>
  2. <html>
  3. <head>
  4. <Meta charset="utf-8">
  5. <title>Lodashtest3</title>
  6. <base href="/">
  7.  
  8. <link rel="icon" type="image/x-icon" href="favicon.ico">
  9. <Meta name="viewport" content="width=device-width,initial-scale=1">
  10.  
  11. <!-- Service worker support is disabled by default.
  12. Install the worker script and uncomment to enable.
  13. Only enable service workers in production.
  14. <script type="text/javascript">
  15. if ('serviceWorker' in navigator) {
  16. navigator.serviceWorker.register('/worker.js').catch(function(err) {
  17. console.log('Error installing service worker: ',err);
  18. });
  19. }
  20. </script>
  21. -->
  22. </head>
  23. <body>
  24. <lodashtest3-app>Loading...</lodashtest3-app>
  25.  
  26. <script src="vendor/es6-shim/es6-shim.js"></script>
  27. <script src="vendor/reflect-Metadata/Reflect.js"></script>
  28. <script src="vendor/systemjs/dist/system.src.js"></script>
  29. <script src="vendor/zone.js/dist/zone.js"></script>
  30.  
  31. <script>
  32. System.import('system-config.js').then(function () {
  33. System.import('main');
  34. }).catch(console.error.bind(console));
  35. </script>
  36. </body>
  37. </html>
使用稳定版本和当前的角度cli(1.0.0-beta.15),它只是添加了npm包和类型定义
  1. npm install lodash --save
  2. npm install @types/lodash --save-dev

对于早期版本,例如1.0.0-beta.15,下一个版本是必要的.当前版本不应该要求:

将库添加到angular-cli.json到全局脚本列表(将“../node_modules/lodash/lodash.js”添加到列表apps [0] .scripts).

https://github.com/angular/angular-cli#global-library-installation

猜你在找的Angularjs相关文章