How to deploy Angular2 project without using CLI

Question

This is the Folder structure i have made for a project made in angular 2. I have deleted the Node-Module folder and other folder in order to fit it here. For styling i have

Answer 1

I solved this problem by using webpack. My webpack makes a bundle.js which includes all the .js .ts .html files and converts it into bundle.js. which i import in Index.html. This bundle.js contains all the things required for it to run. Other things required by my site, like style.css and some bootstrap libraries have to be included externally in index.html. Steps that you need to follow are:

1. Include "compression-webpack-plugin": "^0.3.2" package in package.json in dev-dependency
2. There are few more things to keep in mind when you use webpack. You need to use correct syntax to import your templates in componenet and there are few changes in routes.

3. I have changed my build script as well in package.json. Added code for webpack to work

   "build": "npm run tsc && npm run clean && mkdir _dist && webpack --devtool inline-source-map",

4. You need to configure your webpack. webpack.config.js contains all the configuration that i have done, It looks something like this.

var webpack = require("webpack");
var CompressionPlugin = require("compression-webpack-plugin");  
module.exports = {
entry: {
 "app": "./app/main"
 },
        output: {
            path: __dirname,
            filename: "./_dist/bundle.js",
            publicPath: 'http://localhost:4242/app'
        },
 resolve: {
        extensions: ['', '.js', '.ts', '.html']
    },
    devtool: 'source-map',
    module: {
        loaders: [
            {
  test: /\.ts$/,
                loaders: ['awesome-typescript-loader', 'angular2-template-loader']
            },
            {
                test: /\.html$/,
                loader: 'html'
            }
    ]
},
htmlLoader: {
    minimize: false
},
plugins: [
    new webpack.NoErrorsPlugin(),
],
devServer: {
    historyApiFallback: true,
 stats: 'minimal',
        inline: true,
        port: 4242
    }
}