-
Notifications
You must be signed in to change notification settings - Fork 241
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
refactor(build): refactor to support AoT
BREAKING CHANGE: NPM Package now comes with ES6 Module version (ESM) and an ES5 UMD bundle (1 file), this should'nt have any effect. (CJS version removed) ES6 version contains `d.ts` files as well as `metadata.json` files for AoT Compilation. This breaking change mainly effect the development process of angular2-modal. To support AoT a complete restructiing of the NPM package and build process was needed. Some devDependencies removed and some changed. Development process is now managed by Webpack 2. It is recommended to delete the node_modules directory and `npm install` again. closes #206 closes #207 closes #204
- Loading branch information
Shlomi Assaf (shlassaf)
committed
Oct 2, 2016
1 parent
bf54101
commit 9db8f5e
Showing
25 changed files
with
128 additions
and
7,342 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,87 +1,77 @@ | ||
| const fs = require('fs'); | ||
| const path = require('path'); | ||
| const exec = require('child_process').exec; | ||
|
|
||
| const del = require('del'); | ||
| const gulp = require('gulp'); | ||
| const runSequence = require('run-sequence'); | ||
| const $ = require('gulp-load-plugins')(); | ||
| const ngc = require('@angular/compiler-cli'); | ||
| const config = require('./config'); | ||
| const merge = require('merge2'); | ||
| const sourcemaps = require('gulp-sourcemaps'); | ||
| const relativeImports = require('./relative-imports'); | ||
|
|
||
| function replaceSrcDir(path) { | ||
| path.dirname = path.dirname.replace(/^src\/components\/angular2-modal/ig, ''); // eslint-disable-line no-param-reassign | ||
| if (path.dirname.indexOf('dist/esm/plugins/') !== 0) { | ||
| path.dirname = 'dist/esm/plugins/' + path.dirname; | ||
| } | ||
| // path.dirname = path.dirname.replace(/^src\/components\/angular2-modal/ig, ''); // eslint-disable-line no-param-reassign | ||
| } | ||
|
|
||
|
|
||
| gulp.task('scripts:esm', () => { | ||
| const taskConfig = $.typescript.createProject(config.PATHS.tsConfig, { | ||
| module: 'ES6', | ||
| target: 'ES6', | ||
| moduleResolution: 'node', | ||
| emitDecoratorMetadata: true, | ||
| experimentalDecorators: true, | ||
| gulp.task('scripts:esm-ngc', (cb) => { | ||
| exec('./node_modules/.bin/ngc -p tsconfig.release.json', function (err, stdout, stderr) { | ||
| console.log(stdout); | ||
| console.log(stderr); | ||
| if (err) { | ||
| cb(err); | ||
| } else { | ||
| // delete all *.ngfactory files. | ||
| del.sync(config.PATHS.dist.esm + '**/*.ngfactory.*'); | ||
| cb(); | ||
| } | ||
| }); | ||
| }); | ||
|
|
||
|
|
||
| gulp.task('scripts:esm-rename-js', () => { | ||
| // todo: this emit errors right now because of duplicate ES6 declarations. | ||
| // should be fixed when https://github.com/angular/angular/issues/4882 is included a new Angular2 version. | ||
| const tsResult = gulp.src(config.PATHS.tsSrcFiles) | ||
| .pipe($.sourcemaps.init()) | ||
| .pipe($.typescript(taskConfig, undefined, $.typescript.reporter.nullReporter())); | ||
| return tsResult.js | ||
|
|
||
| return gulp.src(['dist/esm/plugins/**/*.js']) | ||
| .pipe(relativeImports.es6ImportRename) | ||
| .pipe($.header(config.banner, { | ||
| pkg: config.pkg, | ||
| })) | ||
| .pipe($.rename(replaceSrcDir)) | ||
| .pipe($.sourcemaps.write('.')) | ||
| .pipe(gulp.dest(config.PATHS.dist.esm)); | ||
| .pipe(gulp.dest('.')); | ||
| }); | ||
|
|
||
|
|
||
| gulp.task('scripts:cjs', () => { | ||
| // todo: figure out why gulp-typescript don't write to the defined root dir (dist) | ||
| const tsResult = gulp.src([config.PATHS.tsSrcFiles, 'typings/browser.d.ts']) | ||
| .pipe($.sourcemaps.init()) | ||
| .pipe($.typescript(config.tscConfigCjs)); | ||
|
|
||
| return merge([ | ||
| tsResult.dts | ||
| .pipe(relativeImports.tsDefinitionImportRename) | ||
| .pipe($.header(config.banner, { | ||
| pkg: config.pkg, | ||
| })) | ||
| .pipe($.rename(replaceSrcDir)) | ||
| .pipe(gulp.dest(config.PATHS.dist.cjs)), | ||
|
|
||
| tsResult.js.pipe($.header(config.banner, { | ||
| gulp.task('scripts:esm-rename-dts', () => { | ||
| return gulp.src(['dist/esm/plugins/**/*.d.ts']) | ||
| .pipe(relativeImports.tsDefinitionImportRename) | ||
| .pipe($.header(config.banner, { | ||
| pkg: config.pkg, | ||
| })) | ||
| .pipe(relativeImports.es5RequireVisitor) | ||
| .pipe($.rename(replaceSrcDir)) | ||
| .pipe($.sourcemaps.write('.')) | ||
| .pipe(gulp.dest(config.PATHS.dist.cjs)), | ||
| ]); | ||
| .pipe($.rename(replaceSrcDir)) | ||
| .pipe(gulp.dest('.')); | ||
| }); | ||
|
|
||
| gulp.task('scripts:test', () => { | ||
| const tsResult = gulp.src(config.PATHS.tsTestFiles) | ||
| .pipe(sourcemaps.init()) | ||
| .pipe($.typescript(config.taskConfigCjs)); | ||
| gulp.task('scripts:esm-rename-ngcMetadata', () => { | ||
| return gulp.src(['dist/esm/plugins/**/*.metadata.json']) | ||
| .pipe(relativeImports.ngcMetadataRename) | ||
| .pipe($.rename(replaceSrcDir)) | ||
| .pipe(gulp.dest('.')); | ||
| }); | ||
|
|
||
| // todo: figure out why gulp-typescript don't write to the defined root dir (test-built) | ||
| function replaceTestDir(path) { | ||
| path.dirname = path.dirname.replace('test/', ''); // eslint-disable-line no-param-reassign | ||
| } | ||
| return merge([ | ||
| tsResult.dts | ||
| .pipe($.header(config.banner, { | ||
| pkg: config.pkg, | ||
| })) | ||
| .pipe($.rename(replaceTestDir)) | ||
| .pipe(gulp.dest(config.PATHS.testBuilt)), | ||
| tsResult.js | ||
| .pipe($.rename(replaceTestDir)) | ||
| .pipe($.sourcemaps.write('.')) | ||
| .pipe(gulp.dest(config.PATHS.testBuilt)), | ||
| ]); | ||
| gulp.task('scripts:esm', (done) => { | ||
| runSequence( | ||
| ['scripts:esm-ngc'], | ||
| // plugins requires change to import literals, ../../components/angular2-modal -> angular2-modal | ||
| ['scripts:esm-rename-js', 'scripts:esm-rename-dts', 'scripts:esm-rename-ngcMetadata'], | ||
| done | ||
| ); | ||
| }); | ||
|
|
||
| gulp.task('scripts', ['scripts:cjs', 'scripts:esm']); | ||
| gulp.task('scripts', ['scripts:esm']); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,78 +1,26 @@ | ||
| var gulp = require('gulp'); | ||
| var inlineNg2Template = require('gulp-inline-ng2-template'); | ||
| var transform = require('gulp-transform-js-ast'); | ||
|
|
||
| var jsStringEscape = require('js-string-escape'); | ||
| function doCss(ext, file) { | ||
| return jsStringEscape(file); | ||
| } | ||
|
|
||
| gulp.task('inline-resources', function () { | ||
| gulp.src('./dist/build/components/**/*.js') | ||
| .pipe(inlineNg2Template({base: './dist/build/', target: 'es5', styleProcessor: doCss})) | ||
| .pipe(gulp.dest('./dist/build/components/')); | ||
| const del = require('del'); | ||
| const gulp = require('gulp'); | ||
| const transform = require('gulp-transform-js-ast'); | ||
| require('require-dir')('./gulp'); | ||
| const config = require('./gulp/config'); | ||
| const runSequence = require('run-sequence'); | ||
|
|
||
| gulp.src('./dist/build/demo/**/*.js') | ||
| .pipe(inlineNg2Template({base: './dist/build/', target: 'es5', styleProcessor: doCss})) | ||
| .pipe(gulp.dest('./dist/build/demo/')); | ||
| const distPluginPath = { from: 'dist/esm/plugins/**/*', to: 'dist/plugins' }; | ||
| gulp.task('copyDistPlugins', () => { | ||
| return gulp.src(distPluginPath.from) | ||
| .pipe(gulp.dest(distPluginPath.to)); | ||
| }); | ||
|
|
||
| gulp.task('replace-core-relative-imports', function () { | ||
| var CORE_PACKAGE_NAME = 'angular2-modal'; | ||
| var CORE_IMPORT_REGEX = /^(.*\.\.?\/components\/angular2-modal)(.*)$/; | ||
|
|
||
| function isRequireMethod(path) { | ||
| var node = path.value; | ||
| return node.type === 'CallExpression' && | ||
| node.callee && | ||
| node.callee.type === 'Identifier' && | ||
| node.callee.name === 'require'; | ||
| } | ||
|
|
||
| function isLiteral(path) { | ||
| var args = path.value.arguments; | ||
| return args && | ||
| args.length === 1 && | ||
| args[0].type === 'Literal'; | ||
| } | ||
|
|
||
| function isCandidate(path) { | ||
| return isRequireMethod(path) && isLiteral(path); | ||
| } | ||
|
|
||
| function visitCallExpression(path) { | ||
| if (isCandidate(path)) { | ||
| var match, | ||
| arg = path.value.arguments["0"]; | ||
| if ((match = CORE_IMPORT_REGEX.exec(arg.value)) !== null) { | ||
| arg.value = arg.value.replace(CORE_IMPORT_REGEX, `${CORE_PACKAGE_NAME}$2`); | ||
| } | ||
| } | ||
| return path.value; | ||
| } | ||
|
|
||
| gulp.src(['./dist/build/bootstrap.js']) | ||
| .pipe(transform({visitCallExpression: visitCallExpression})) | ||
| .pipe(gulp.dest('./dist/build')); | ||
|
|
||
| gulp.src(['./dist/build/demo/**/*.js']) | ||
| .pipe(transform({visitCallExpression: visitCallExpression})) | ||
| .pipe(gulp.dest('./dist/build/demo')); | ||
|
|
||
| gulp.src(['./dist/build/components/angular2-modal/plugins/**/*.js']) | ||
| .pipe(transform({visitCallExpression: visitCallExpression})) | ||
| .pipe(gulp.dest('./dist/build/components/angular2-modal/plugins')); | ||
| gulp.task('extractPlugins', ['copyDistPlugins'], (done) => { | ||
| del.sync('dist/esm/plugins', {force: true}); | ||
| done(); | ||
| }); | ||
|
|
||
|
|
||
| require('require-dir')('./gulp'); | ||
| const runSequence = require('run-sequence'); | ||
|
|
||
| gulp.task('build', (done) => { | ||
| runSequence( | ||
| ['clean:dist', 'clean:tmp'], | ||
| ['copyReleaseAssets', 'scripts', 'bundle'], | ||
| 'createPackageJson', | ||
| ['copyReleaseAssets', 'bundle'], | ||
| ['extractPlugins','createPackageJson'], | ||
| done | ||
| ); | ||
| }); |
Oops, something went wrong.