Skip to content

Commit 5b73d7b

Browse files
author
Kishore Ithadi
committed
added inline build, seperated gulp tasks
1 parent 27c3d3e commit 5b73d7b

12 files changed

+182
-119
lines changed

‎.gitignore

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
node_modules
22
app/**/*.js
33
app/**/*.js.map
4+
app/**/*.d.ts
45
*.log
5-
build
66
dist
77
scripts
88
src/jscode

‎gulp-tasks/build-js-css.js

+43
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
var gulp = require("gulp");
2+
var uglify = require("gulp-uglify");
3+
var rename = require('gulp-rename');
4+
var clean = require('gulp-clean');
5+
var cssMinify = require('gulp-cssnano');
6+
7+
var SystemBuilder = require('systemjs-builder');
8+
9+
// Bundle jS and CSS *************************************************************************************
10+
11+
// loads all the required files based on systemjs.config.js
12+
// bundles them into bundle.js then minifying into bundle.min.js
13+
gulp.task('build-js', () => {
14+
var builder = new SystemBuilder();
15+
16+
return builder.loadConfig('systemjs.config.js')
17+
.then(() => builder.buildStatic('app', 'dist/src/scripts/bundle.js', {
18+
minify: false, sourceMaps: false, encodeNames:false
19+
}))
20+
.then(() => gulp.src('dist/src/scripts/bundle.js')
21+
.pipe(rename({
22+
suffix: '.min'
23+
}))
24+
.pipe(gulp.dest('dist/src/scripts/'))
25+
.pipe(uglify())
26+
.pipe(gulp.dest('dist/src/scripts/')))
27+
.then(() => gulp.src(['dist/src/scripts/bundle.js'], {
28+
read: false
29+
})
30+
.pipe(clean()));
31+
32+
});
33+
34+
gulp.task('build-css', function () {
35+
return gulp.src([
36+
'src/css/main.css'
37+
])
38+
.pipe(rename({
39+
suffix: '.min'
40+
}))
41+
.pipe(cssMinify())
42+
.pipe(gulp.dest('dist/src/css/'))
43+
});

‎gulp-tasks/build-prod-inline.js

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
var gulp = require("gulp");
2+
var runSequence = require('run-sequence');
3+
4+
// Copy jS and CSS *************************************************************************************
5+
6+
gulp.task('copy-html', function () {
7+
return gulp.src('productionfiles/index.html')
8+
.pipe(gulp.dest('dist/'));
9+
});
10+
11+
// Default task *************************************************************************************
12+
13+
gulp.task('build-prod-inline', function (done) {
14+
runSequence('clean', 'vendor-js', 'vendor-css', 'tsc-inline', 'build-js', 'build-css', 'copy-html','remove-jscode', done);
15+
});

‎gulp-tasks/build-prod.js

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
var gulp = require("gulp");
2+
var runSequence = require('run-sequence');
3+
4+
// Copy jS and CSS *************************************************************************************
5+
6+
gulp.task('copy-html', function () {
7+
return gulp.src('productionfiles/index.html')
8+
.pipe(gulp.dest('dist/'));
9+
});
10+
11+
gulp.task('copy-component-html', function () {
12+
return gulp.src('src/app/**/*.html')
13+
.pipe(gulp.dest('dist/src/app'));
14+
});
15+
16+
// Default task *************************************************************************************
17+
18+
gulp.task('build-prod', function (done) {
19+
runSequence('clean', 'vendor-js', 'vendor-css', 'tsc', 'build-js', 'build-css', 'copy-html', 'copy-component-html', 'remove-jscode', done);
20+
});

‎gulp-tasks/clean.js

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
var gulp = require("gulp");
2+
var clean = require('gulp-clean');
3+
4+
// Clean gulp build folders*********************************************************************
5+
6+
gulp.task('clean', function () {
7+
return gulp.src(['src/jscode', 'dist'], {
8+
read: false
9+
})
10+
.pipe(clean())
11+
});

‎gulp-tasks/remove-jscode.js

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
var gulp = require("gulp");
2+
var clean = require('gulp-clean');
3+
4+
// Clean gulp build folders*********************************************************************
5+
6+
gulp.task('remove-jscode', function () {
7+
return gulp.src(['jscode'], {
8+
read: false
9+
})
10+
.pipe(clean())
11+
});

‎gulp-tasks/tsc-inline.js

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
var gulp = require("gulp");
2+
var ts = require('gulp-typescript');
3+
4+
var tscProject = ts.createProject('tsconfig.json');
5+
6+
var inlineTemplate = require('gulp-inline-ng2-template');
7+
var inlineStyles = require('gulp-inline-ng2-styles');
8+
9+
10+
// build the html and css into the js files
11+
gulp.task('tsc-inline', () => {
12+
return gulp.src('src/app/**/*.ts')
13+
.pipe(inlineTemplate({
14+
base: '/src/app',
15+
useRelativePaths: true
16+
}))
17+
.pipe(inlineStyles({
18+
base: '/src/app',
19+
useRelativePaths: true
20+
}))
21+
.pipe(tscProject())
22+
.pipe(gulp.dest('src/jscode'));
23+
});

‎gulp-tasks/tsc.js

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
var gulp = require("gulp");
2+
var ts = require('gulp-typescript');
3+
4+
var tscProject = ts.createProject('tsconfig.json');
5+
6+
gulp.task('tsc', () => {
7+
return gulp.src('src/app/**/*.ts')
8+
.pipe(tscProject())
9+
.pipe(gulp.dest('src/jscode'));
10+
});

‎gulp-tasks/vendor-js-css.js

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
var gulp = require("gulp");
2+
var concat = require("gulp-concat");
3+
var uglify = require("gulp-uglify");
4+
var rename = require('gulp-rename');
5+
var cssMinify = require('gulp-cssnano');
6+
7+
// Vendor jS and CSS *************************************************************************************
8+
gulp.task('vendor-js', () => {
9+
return gulp.src([
10+
'node_modules/core-js/client/shim.js',
11+
'node_modules/zone.js/dist/zone.js',
12+
'node_modules/systemjs/dist/system.src.js',
13+
'node_modules/jquery/dist/jquery.min.js',
14+
'node_modules/bootstrap/dist/js/bootstrap.min.js'
15+
])
16+
.pipe(concat('vendorjs.js'))
17+
.pipe(rename({
18+
suffix: '.min'
19+
}))
20+
.pipe(uglify())
21+
.pipe(gulp.dest('dist/src/scripts/'))
22+
});
23+
24+
gulp.task('vendor-css', () => {
25+
return gulp.src([
26+
'node_modules/bootstrap/dist/css/bootstrap.min.css'
27+
])
28+
.pipe(concat('vendorcss.css'))
29+
.pipe(rename({
30+
suffix: '.min'
31+
}))
32+
.pipe(cssMinify())
33+
.pipe(gulp.dest('dist/src/css/'))
34+
});

‎gulpfile.js

+2-111
Original file line numberDiff line numberDiff line change
@@ -1,111 +1,2 @@
1-
var gulp = require("gulp");
2-
var concat = require("gulp-concat");
3-
var uglify = require("gulp-uglify");
4-
var rename = require('gulp-rename');
5-
var sourcemaps = require('gulp-sourcemaps');
6-
var ts = require('gulp-typescript');
7-
var clean = require('gulp-clean');
8-
var cssMinify = require('gulp-cssnano');
9-
var runSequence = require('run-sequence');
10-
11-
var tscProject = ts.createProject('tsconfig.json');
12-
13-
var SystemBuilder = require('systemjs-builder');
14-
15-
// cleans the previous builds
16-
gulp.task('clean', function () {
17-
return gulp.src(['dist', 'src/jscode'], {
18-
read: false
19-
})
20-
.pipe(clean())
21-
});
22-
23-
// Vendor jS and CSS *************************************************************************************
24-
gulp.task('vendor-js', () => {
25-
return gulp.src([
26-
'node_modules/core-js/client/shim.js',
27-
'node_modules/zone.js/dist/zone.js',
28-
'node_modules/systemjs/dist/system.src.js',
29-
'node_modules/jquery/dist/jquery.min.js',
30-
'node_modules/bootstrap/dist/js/bootstrap.min.js'
31-
])
32-
.pipe(concat('vendorjs.js'))
33-
.pipe(rename({
34-
suffix: '.min'
35-
}))
36-
.pipe(uglify())
37-
.pipe(gulp.dest('dist/src/scripts/'))
38-
});
39-
40-
gulp.task('vendor-css', () => {
41-
return gulp.src([
42-
'node_modules/bootstrap/dist/css/bootstrap.min.css'
43-
])
44-
.pipe(concat('vendorcss.css'))
45-
.pipe(rename({
46-
suffix: '.min'
47-
}))
48-
.pipe(cssMinify())
49-
.pipe(gulp.dest('dist/src/css/'))
50-
});
51-
52-
// Bundle jS and CSS *************************************************************************************
53-
54-
gulp.task('tsc', () => {
55-
return gulp.src('src/app/**/*.ts')
56-
.pipe(tscProject())
57-
.pipe(gulp.dest('src/jscode'));
58-
});
59-
60-
// loads all the required files based on systemjs.config.js
61-
// bundles them into bundle.js then minifying into bundle.min.js
62-
gulp.task('build-js', ['tsc'], () => {
63-
var builder = new SystemBuilder();
64-
65-
return builder.loadConfig('systemjs.config.js')
66-
.then(() => builder.buildStatic('app', 'dist/src/scripts/bundle.js', {
67-
minify: false, sourceMaps: true, encodeNames:false
68-
}))
69-
.then(() => gulp.src('dist/src/scripts/bundle.js')
70-
.pipe(rename({
71-
suffix: '.min'
72-
}))
73-
.pipe(gulp.dest('dist/src/scripts/'))
74-
.pipe(uglify())
75-
.pipe(gulp.dest('dist/src/scripts/')))
76-
.then(() => gulp.src(['dist/src/scripts/bundle.js'], {
77-
read: false
78-
})
79-
.pipe(clean()));
80-
81-
});
82-
83-
gulp.task('build-css', function () {
84-
return gulp.src([
85-
'src/css/main.css'
86-
])
87-
.pipe(rename({
88-
suffix: '.min'
89-
}))
90-
.pipe(cssMinify())
91-
.pipe(gulp.dest('dist/src/css/'))
92-
});
93-
94-
95-
// Copy jS and CSS *************************************************************************************
96-
97-
gulp.task('copy-html', function () {
98-
return gulp.src('productionfiles/index.html')
99-
.pipe(gulp.dest('dist/'));
100-
});
101-
102-
gulp.task('copy-component-html', function () {
103-
return gulp.src('src/app/**/*.html')
104-
.pipe(gulp.dest('dist/src/app'));
105-
});
106-
107-
// Default task *************************************************************************************
108-
109-
gulp.task('build-prod', function (done) {
110-
runSequence(['vendor-js', 'vendor-css', 'build-js', 'build-css', 'copy-html', 'copy-component-html'], done);
111-
});
1+
var requireDir = require('require-dir');
2+
requireDir('./gulp-tasks');

‎package.json

+9-6
Original file line numberDiff line numberDiff line change
@@ -18,11 +18,13 @@
1818
"systemjs": "0.19.40",
1919
"core-js": "^2.4.1",
2020
"rxjs": "5.0.1",
21-
"zone.js": "^0.7.4"
22-
},
23-
"devDependencies": {
21+
"zone.js": "^0.7.4",
22+
"typescript": "^2.0.10",
2423
"@types/node": "^7.0.8",
2524
"bootstrap": "^3.3.7",
25+
"jquery": "^3.1.1"
26+
},
27+
"devDependencies": {
2628
"concurrently": "^3.1.0",
2729
"gulp": "^3.9.1",
2830
"gulp-clean": "^0.3.2",
@@ -32,11 +34,12 @@
3234
"gulp-sourcemaps": "^2.4.0",
3335
"gulp-typescript": "^3.1.4",
3436
"gulp-uglify": "^2.0.1",
37+
"gulp-inline-ng2-styles": "0.0.1",
38+
"gulp-inline-ng2-template": "^4.0.0",
3539
"http-server": "^0.9.0",
36-
"jquery": "^3.1.1",
3740
"lite-server": "^2.2.2",
3841
"run-sequence": "^1.2.2",
3942
"systemjs-builder": "^0.16.2",
40-
"typescript": "^2.0.10"
43+
"require-dir": "^0.3.1"
4144
}
42-
}
45+
}

‎systemjs.config.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,10 @@
22
* System configuration for Angular samples
33
* Adjust as necessary for your application needs.
44
*/
5-
(function(global) {
5+
(function (global) {
66
System.config({
7+
baseURL: "/",
8+
defaultJSExtensions: true,
79
paths: {
810
// paths serve as alias
911
'npm:': '/node_modules/'

0 commit comments

Comments
 (0)