Angular CLI中的第三方库不在npm上

2 回答

• 1

  大多数情况下是的，但这取决于图书馆的用途 . 仍然Angular-cli在第三方库集成方面存在一些问题 . 直到他们正确地修复它，我可以给你一个黑客 . 假设您想在代码中使用 _ 的 lodash . 所以我会告诉你我的工作代码情景 -

  安装lodash

  npm install lodash --save
  typings install lodash --ambient --save
  

  在此之前，请确保全局安装打字

  npm install typings -g
  

  然后在你的angular-cli-build.json中，确保它保持这种方式

  module.exports = function(defaults) {
    return new Angular2App(defaults, {
      vendorNpmFiles: [
        ...
        'lodash/**/*.js'
      ]
    });
  };
  

  并在您的system-config.ts中：

  /** Map relative paths to URLs. */
   const map: any = {
     'lodash': 'vendor/lodash/lodash.js'
   };
  
   /** User packages configuration. */
   const packages: any = {
     'lodash': {
       format: 'cjs'
     }
   };
  

  在你的src / index.html中添加这一行（这是奇怪的修复）

  <script src="/vendor/lodash/lodash.js" type="text/javascript"></script>
  

  现在在您想要使用lodash的组件中，以这种方式编写

  declare var _:any;
  
  @Component({
  })
  export class YourComponent {
    ngOnInit() {
       console.log(_.chunk(['a', 'b', 'c', 'd'], 2));
    }
  }
  

  它对我有用:) . 我通过angular-cli在angular2项目中使用了巨大的第三方库 . 希望它也会对你有所帮助

  Edit:

  如果您没有为您的第三方库获得任何npm . 在 src 文件夹下创建一个 assets 文件夹 . 然后，您可以为 js ， css 和 images 添加单独的文件夹 . 将您的第三方js放在 js 文件夹中 . 然后你必须像这样在_206061中引用js文件：

  <script src="assets/js/your_js.js"></script>
  

  现在，当您执行 ng build 或 ng serve 时，它将自动使用 assets/js 更新 public 文件夹 . 希望你了解整个场景:)

  回复于 2024-04-27T01:02:12+08:00
• 1

  我不熟悉orbitcontrols.js，但我认为它是一个全局对象 .

  将该文件放在CLI创建的 public 目录中 . 我建议将那些东西分组，所以 public/js/orbitcontrols.js .

  然后你可以通过以下方式在 index.html 文件中引用该js文件：

  <script src="js/orbitcontrols.js"></script>
  

  回复于 2024-04-27T01:02:12+08:00