Erik Erik - 1 month ago 73
TypeScript Question

Error in angular2-clipboard while building angular2 project with angular cli

When building my angular2 project with

ng build
I get the following error

Error in bail mode: [default] /Users/erikwitt/Documents/git/workflow-lights/node_modules/angular2-clipboard/src/clipboard.directive.ts:2:0
Import assignment cannot be used when targeting ECMAScript 2015 modules. Consider using 'import * as ns from "mod"', 'import {a} from "mod"', 'import d from "mod"', or another module format instead.


Not sure why the
angular2-clipboard
get this TypeScript error. Every thinks works fine in development with
ng server
.

My
tsconfig.json
is the following:

{
"compilerOptions": {
"declaration": false,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [
"es6",
"dom",
"es2015.collection"
],
"mapRoot": "./",
"module": "es6",
"moduleResolution": "node",
"outDir": "../dist/out-tsc",
"sourceMap": true,
"target": "es5",
"typeRoots": [
"../node_modules/@types"
]
}
}

Answer

It looks like the angular2-clipboard does not work with the es6 module configuration. Try to change it to commonjs:

{
   "compilerOptions": {
     "declaration": false,
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
     "lib": [
       "es6",
       "dom",
       "es2015.collection"
     ],
     "mapRoot": "./",
     "module": "commonjs",
     "moduleResolution": "node",
     "outDir": "../dist/out-tsc",
     "sourceMap": true,
     "target": "es5",
     "typeRoots": [
       "../node_modules/@types"
     ]
   }
}