CODEWITHSUNDEEP
angularangular-cling-packagrng-buildangular-cli-v7
Oam Psy
Oam Psy

Reputation: 8663

Error building .js files with ng build on lib

I have an app that I am trying to convert to use angular cli (v7). The app is in working order.

The app consists of 2 sites and a common lib:

- ui-site-1
- ui-site-2
- ui-lib

I am using ng build to build and package UI-lib but there are errors on the FESM2015 stage pointing to public_api.ts:

public_api.ts:

// Lots of exports...
export { setup } from './core/connect/setup'; <-- Falls over if including this.

connect/setup.js

function setup(p1, p2, p3) {
// Some code
}


function method12(p1, p2, p3) {
// Some code
}

export { setup };

Error:

Could no resolve './setup' from ui-lib/dist/esm2015/core/setup.js

Note: If i convert the file to .ts, ng build runs fine and a dist folder is created. However, within setup.js, i pull in a number of other .js files so converting all these to .ts and resolving the type issues is not an option right now

Update:

tsconfig.json

{
    "compileOnSave": false,
    "compilerOptions": {
        "baseUrl": "./",
        "outDir": "./dist/out-tsc",
        "sourceMap": true,
        "declaration": false,
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "importHelpers": true,
        "target": "es5",
        "typeRoots": [
            "node_modules/@types"
        ],
        "lib": [
            "es2017",
            "dom"
        ],
        "paths": {
            "my-lib": [
                "dist/my-lib"
            ],
            "my-lib/*": [
                "dist/my-lib/*"
            ]
        }
    }
}

tsconfig.lib.json:

{
    "extends": "../tsconfig.json",
    "compilerOptions": {
        "outDir": "../../out-tsc/lib",
        "target": "es2015",
        "module": "es2015",
        "moduleResolution": "node",
        "declaration": true,
        "sourceMap": true,
        "inlineSources": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "importHelpers": true,
        "types": []
    },
    "angularCompilerOptions": {
        "annotateForClosureCompiler": false,
        "skipTemplateCodegen": true,
        "strictMetadataEmit": false,
        "fullTemplateTypeCheck": true,
        "strictInjectionParameters": true,
        "enableResourceInlining": true
    },
    "exclude": [
        "src/test.ts",
        "**/*.spec.ts"
    ],
    "include": [
        "src/**/*",
        "./src/**/*",
    ]
}

Upvotes: 1

Views: 81

Answers (1)

Aux
Aux

Reputation: 438

connect/setup.js should be:

export function setup(p1, p2, p3) {
// Some code
}


function method12(p1, p2, p3) {
// Some code
}

Upvotes: 1

Related Questions