Adding Karma, Jasmine specs to working anuglar app - node.js

Question

We have an angular app under development. Business code is working and is almost stable. In the app, we have placed JSPs and ts (and generated *.js, *.js.map) files into different folders. Please find project folder structure below:
/angular
--node_modules
--package.json
--
--bills
--a.component.ts
--a.component.spec.ts
--a.component.js
--a.component.spec.js
--a.component.js.map
--a.component.spec.js.map
--pages
--com
--bills
--a.jsp
Karma start prints below error log:
c:\...\angular>.\node_modules\.bin\karma start
24 07 2018 15:33:27.883:ERROR [karma]: { Error: ENOENT: no such file or directory, open 'c:\..\angular\<jsp_path_mentioned_in_component_template_url>'
We cannot have JSPs and ts files in the same folder. We have lot of files and its not feasible to change the project structure now.
Could you help us know where to update karma config to pic JSP from a custom location.
Hope to find some helpful pointers/inputs. Thanks in advance.
Update: Added karma.config.js
karma.config.js:
module.exports = function(config) {
config.set({
basePath: '.',
frameworks: ['jasmine'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage'),
require('karma-generic-preprocessor'),
require('karma-mocha-reporter'),
require('karma-sourcemap-loader')
],
client: {
clearContext: true // leave Jasmine Spec Runner output visible in browser
},
files: [
// System.js for module loading
'node_modules/systemjs/dist/system.src.js',
// Polyfills
'node_modules/core-js/client/shim.min.js',
'node_modules/systemjs/dist/system-polyfills.js',
// zone.js
'node_modules/zone.js/dist/zone.js',
'node_modules/zone.js/dist/long-stack-trace-zone.js',
'node_modules/zone.js/dist/proxy.js',
'node_modules/zone.js/dist/sync-test.js',
'node_modules/zone.js/dist/jasmine-patch.js',
'node_modules/zone.js/dist/async-test.js',
'node_modules/zone.js/dist/fake-async-test.js',
// RxJs
{ pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false },
{ pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false },
// Paths loaded via module imports: Angular itself
{ pattern: 'node_modules/#angular/**/*.js', included: false, watched: false },
{ pattern: 'node_modules/#angular/**/*.js.map', included: false, watched: false },
{ pattern: 'systemjs.config.js', included: false, watched: false },
'karma-test-shim.js',
{ pattern: 'payment-pending/payment-pending-select.component.js', included: false, watched: true },
{ pattern: '**/test.component.js', included: false, watched: true },
{ pattern: '**/test.component.spec.js', included: false, watched: true },
],
proxies: {
// required for modules fetched by SystemJS
'/base/resources/js/plugins/angular/': '/base/node_modules/'
},
exclude: [],
preprocessors: { 'test.component.js': ['coverage'], "**/*.component.js": ["generic"], "**/*.js" : ['sourcemap']},
coverageReporter: {
includeAllSources: true,
dir: 'mycoverage/',
reporters: [
{ type: "html", subdir: "html" },
{ type: 'text-summary' }
]
},
reporters: ['mocha','coverage'],
mochaReporter: {
colors: {
success: 'green',
info: 'grey',
warning: 'yellow',
error: 'red'
},
symbols: {
success: '-',
info: '#',
warning: '!',
error: 'x'
}
},
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false,
genericPreprocessor: {
rules: [{
process: function (content, file, done, log) {
//Prepare content for parser
file.contents = new Buffer(content);
// Every file has a parser
var parse = require('gulp-inline-ng2-template/parser')(file, { base: "", useRelativePaths: true, templateExtension:'.jsp' });
// Call real parse function
parse(function (err, contents) {
// Callback with content with template and style inline
done(contents);
});
}
}]
},
})
}