How to add 3rd party dependencies

[bastienJS]

I use

angular-cli: 1.0.0-beta.16                                                                                                    
node: 6.2.2                                                                                                                          
os: win10  x64  

I am missing kind of a webpack configuration file. It seems webpack configuration file is hidden under the ng cli.

How can I add 3rd party dependencies to import them into my component?

These are all the files I have in my project root path:

[GregOnNet]

Hi,

inside angular-cli.json you have the possibility to add scripts and styles of 3rd party providers.
Please have a look on the properties styles and scripts:

{
  "project": {
    "version": "1.0.0-beta.16",
    "name": "vocab-trainer"
  },
  "apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": "assets",
      "index": "index.html",
      "main": "main.ts",
      "test": "test.ts",
      "tsconfig": "tsconfig.json",
      "prefix": "vt",
      "mobile": false,
      "styles": [
        "styles.css"
      ],
      "scripts": [
        "../node_modules/hammerjs/hammer.min.js"
      ]
   }],
   "addons": [],
   "packages": []
}

I hope this helps.

[bastienJS]

sorry forgot to say I tried that too in the angular cli json file:

  "scripts": ["../node_modules/linq-es2015/dist/linq.js"],

But I still get the same error when I start my app:

linq.js:16 Uncaught Error: Cannot find module "."

although I import correctly in my component:

import * as Enumerable from "linq-es2015";

[toiladuy]

If you want add a library from npm modules, you should follow as

npm install linq-es2015 --save
npm install @types/linq-es2015 --save-dev

I think styles and scripts just for include libraries from folder src/

[bastienJS]

When I run npm install @types/linq-es2015 --save-dev I get:

npm ERR! 404 Not found : @types/linq-es2015

[GregOnNet]

@kiddy2910 styles and scripts also include libraries from other directories (like node_modules)

[GregOnNet]

@bastienJS In your case I would try to get LinqJS to run with webpack itself to identify if the problem is related to angular-cli.

[bastienJS]

@GregOnNet You mean just try this library: https://www.npmjs.com/package/linq

and import the same way to find out wether its a CLI or library problem or me? 📦

I already wanted to do that just with jquery because the tips/problems around it are many.

[GregOnNet]

Yeah, you get me right. :)
Making a setup with webpack and typescript, including linq and see if special configurations needed in webpack to get linq to work.

Until now I personally think that your problem is not related to the CLI.
But it's just my guess.

[bastienJS]

After I did:

npm install linq --save
npm install @types/linq --save-dev

angularcli.json: "scripts": ["../node_modules/linq/linq.js"],

At least the tpyes got installed, but why does the import not work?
See the error in the image.

index.d.ts is not a module!

@GregOnNet Do you know any typed library which for sure works with webpack so I try this one?

[toiladuy]

@GregOnNet Hmm, I see you meant, but scripts only import scripts like external js, so we cannot use with typescript import, we can just use it like global variable or require.

[bastienJS]

Might be a problem with: ENikS/LINQ#37

[mkoczorowski]

Can I just ask what is the purpose of
"addons": [],
"packages": []
in angular-cli config ?

Thanks

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}