Search code examples
angularjswebpackoclazyload

What is the right way to let the lazyloaded file (*.ts) to be compiled


When lazyLoading script files via oclazyloader for angularjs like:

$stateProvider
.state('tokenReceived', {
    url: '/somurl',
    //templateUrl: '/views/index.html',
    controller: "controllers.loremCtrl",
    resolve: {
        deps: ['$ocLazyLoad', function ($ocLazyLoad) {
            return $ocLazyLoad.load({
                files: [
                    scriptPath + 'loremCtrl.js'
                ],
                cache:false
            });
        }]
    }
})

andy my tsconfig.json file looks like

{  
  "compilerOptions": {
    "module": "commonjs",
    "typeRoots": [
      "./node_modules/@types/"
    ],
    "noImplicitAny": false,
    "noEmitOnError": true,
    "removeComments": false,
    "sourceMap": true,
    "target": "es5"
  },
  "exclude": [
    "node_modules",
    "wwwroot"
  ]
}

The defined entry inside of webpack looks like

module.exports = function (env) {
    return Merge(require(`./webpack.${env}.js`), {
        entry: {
            vendor: [
                "jquery",
                "toastr"
            ],
            rootApp: "./Scripts/rootApp.js",
        },
        resolve: {            
            extensions: [".ts", "tsx", ".js"]
        },
        module: {
            rules: [
                //NON-PRE                  
                { test: /\.ts?$/, loader: "ts-loader" },
                { test: /\.css$/, use: ExtractTextPlugin.extract({ use: ['css-loader'] }) },
                //PRE 
                { test: /(\.png|\.gif|\.ttf|\.eot|\.woff|\.svg)/, loader: "file-loader", enforce: "pre", },
                { test: /\.js$/, loader: "source-map-loader", enforce: "pre", }
            ]
        },
    }
}

what is the right way to let the lazyloaded file (*.ts) to be compiled by webpack2?

At first i had in the tsconfig.json compileOnSave: true but this is not needed in combination with webpack? Did i miss something?

Is the "loremCtrl.ts" compiled and saved in the "rootApp.js"? How am i supposed to use webpack to compile the lazyloaded file?


Solution

  • this seems only to update the lazyloaded code in combination with webpack-dev-server on development