Angular-cli like scripts option


#1

Hi there,

I need to import some js libraries like forge, authenticator or unibabel. I tried to import forge, but building gives some errors:

SyntaxError: Error transforming /Users/mau04/ionic-qr/node_modules/node-forge/js/forge.js with 'commonjs' plugin: Deleting local variable in strict mode (53:4) in /Users/mau04/ionic-qr/node_modules/node-forge/js/forge.js
    at Parser.pp$4.raise (/Users/mau04/ionic-qr/node_modules/rollup-plugin-commonjs/node_modules/acorn/dist/acorn.js:2431:15)
    at Parser.pp$3.parseMaybeUnary (/Users/mau04/ionic-qr/node_modules/rollup-plugin-commonjs/node_modules/acorn/dist/acorn.js:1804:14)
    at Parser.pp$3.parseExprOps (/Users/mau04/ionic-qr/node_modules/rollup-plugin-commonjs/node_modules/acorn/dist/acorn.js:1750:21)
    at Parser.pp$3.parseMaybeConditional (/Users/mau04/ionic-qr/node_modules/rollup-plugin-commonjs/node_modules/acorn/dist/acorn.js:1733:21)
    at Parser.pp$3.parseMaybeAssign (/Users/mau04/ionic-qr/node_modules/rollup-plugin-commonjs/node_modules/acorn/dist/acorn.js:1710:21)
    at Parser.pp$3.parseExpression (/Users/mau04/ionic-qr/node_modules/rollup-plugin-commonjs/node_modules/acorn/dist/acorn.js:1686:21)
    at Parser.pp$1.parseStatement (/Users/mau04/ionic-qr/node_modules/rollup-plugin-commonjs/node_modules/acorn/dist/acorn.js:767:47)
    at Parser.pp$1.parseBlock (/Users/mau04/ionic-qr/node_modules/rollup-plugin-commonjs/node_modules/acorn/dist/acorn.js:1026:25)
    at Parser.pp$1.parseStatement (/Users/mau04/ionic-qr/node_modules/rollup-plugin-commonjs/node_modules/acorn/dist/acorn.js:744:33)
    at Parser.pp$1.parseIfStatement (/Users/mau04/ionic-qr/node_modules/rollup-plugin-commonjs/node_modules/acorn/dist/acorn.js:869:28)

Now I was wondering if there is an option similar to the angular-cli option “scripts”. Angular CLI - Scripts Option

This option basically allows importing scripts as if they were imported by a script tag.

Is there something like this, or is there another way to import these libraries?

Thank you.


#2

same problem here :frowning: imported node-forge library, here below the errors

bundle update failed: Error transforming …/App/node_modules/node-forge/js/forge.js

with ‘commonjs’ plugin: Deleting local variable in strict mode (53:4) in …/App/node_modules/node-forge/js/forge.js


#3

I solved it by creating a custom copy config:

module.exports = {
  include: [
   {
    src: 'src/assets/',
    dest: 'www/assets/'
   },
   {
     src: 'src/index.html',
     dest: 'www/index.html'
   },
   {
     src: 'libs',
     dest: 'www/libs'
   },
   {
     src: 'node_modules/ionic-angular/polyfills/polyfills.js',
     dest: 'www/build/polyfills.js'
   },
   {
      src: 'node_modules/ionicons/dist/fonts/',
      dest: 'www/assets/fonts/'
   }
  ]
};

So just copy all additional scripts to libs/ (of course create it first) and they will be included in the bundle.

In order to use it you have to adjust the build and watch scripts in your package.json:

"build": "ionic-app-scripts build --copy ./config/copy.config.js",
"watch": "ionic-app-scripts watch --copy ./config/copy.config.js",

#4

Thanks, I’ll try it.


#5

Can you please explain it more.


#6

Hi @codiqa100058608, I wasn’t able to make it work. I also tried use typings command to do it in a cleaner way but with the same result.

In the solution you proposed I don’t understand how to do it, let me explain better:

I created a file ‘copy.config.js’ in my ionic 2 project in src --> config; but the structure of the file you suggested, I think it’s old or it has something that I don’t understand, compared with the new ionic 2 structure.
Anyway I just kept the folders and files that I think should be there.
I changed also tha package.json file as suggested with no luck.

Maybe it’s me that I don’t have a real knowledge of it.
Thanks again for your time.


#7

Did you make it work?
I tried last few days but no success!


#8

Upgraded to latest release of Ionic 2.0.0, then by using rollup.config.js able to make it work


#9

I created a brand new project with last version of ionic
Installed the node-forge library --> $ npm install node-forge --save
Installed the typescript --> $ npm install @types/node-forge --save

Create the rollup.config.js in the main project folder based on the one from ./node_modules/@ionic/app-scripts/config/rollup.config.js

I just added that


plugins: [
builtins(),
commonjs({
namedExports:{
// node-forge
’node_modules/node-forge/js/forge.js’: [‘forge’]
}
}),
nodeResolve({

In the package.json file added at the end


“config”: {
“ionic_rollup”: “./config/rollup.config.js”
}

Recall the forge library in a *.ts file like below

import { Component } from ‘@angular/core’;
import forge from ‘node-forge’;

@Component({
templateUrl: ‘hello-ionic.html’
})
export class HelloIonicPage {
constructor() {

}

testForgeLib(){

console.log('passed to forge btn')

let keypair = forge.pki.rsa.generateKeyPair({bits: 512});
console.log('keypair --> ' + keypair);

let privateKeyPem = forge.pki.privateKeyToPem(keypair.privateKey);
console.log('privateKeyPem --> ' + privateKeyPem);

let publicKeyPem = forge.pki.publicKeyToPem(keypair.publicKey);
console.log('publicKeyPem --> ' + publicKeyPem);

let x: string = forge.ssh.privateKeyToOpenSSH();
console.log('x --> ' + x);

}
}

Got the error below after ionic serve command

rollup failed: Error transforming 

/Users/asimonetto/Progetti/Ionic/Progetti/Altri/NodeForge/node_modules/node-forge/js/forge.js with 
'commonjs' plugin: Deleting local variable in strict mode (53:4) in 

/Users/asimonetto/Progetti/Ionic/Progetti/Altri/NodeForge/node_modules/node-forge/js/forge.js 

What am I doing wrong?!?!
Thanks