Importing with Angular 2

[AndreSchickling]

We have the following problem with using the audi-ui in our Angular 2 project.

Installing via: npm install @audi/audi-ui works fine. After that it is existing in the node_modules folder, and in the package json the following line is added.

"@audi/audi-ui": "^1.0.0-alpha.1",

So importing import aui from 'audi-ui'; should work, but it doesnt. It returns:

"cannot find module 'audi-ui'".

Did someone have the same problem? And how did you solve this issue?

[davidenke]

It's the way the module is exported. Do you use the Angular CLI/Webpack/Typescript?

[AndreSchickling]

Yes we do.

[davidenke]

For us it was important to modify the tsconfig.json. We added "allowJs": true to the compilerOptions and es6 to lib and module:

{
  "compilerOptions": {
    "allowJs": true,
    "lib": ["es6", "dom"],
    "module": "es6",
    "moduleResolution": "node",
    "target": "es5",
    ...
  }
}

[skaindl]

You could also create your own type definitions and include any classes or methods from the module that you need to reference. Then you include it in tsconfig.json like so:

{
    ...
    "typeRoots": [
        "src/my-typings-folder/my-audi-ui-typings-module"
    ]
    ...
}

[vadaszszilard]

we have the same problem "audi-ui-angular-compatible": "0.0.2" "cannot find module 'audi-ui' "compilerOptions": { "module": "es2015", "moduleResolution": "node", "target": "es2015", "sourceMap": true, "experimentalDecorators": true, "emitDecoratorMetadata": true, "skipDefaultLibCheck": true,
"strict": true, "lib": [ "es6", "dom" ], "types": [ "webpack-env" ], "strictNullChecks": false },

[MichaelRoger]

Hi, i think you need to use this:

import aui from '@audi/audi-ui';