Skip to content

Improve babel integration #523

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Aug 10, 2015
Merged

Improve babel integration #523

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
2cea691
Fix Babel source maps and `.babelrc` resolution
Aug 9, 2015
66d3800
Fix indentation in `building.ts`
Aug 9, 2015
87bc64f
Use union type for the `externalTranspiler` option
Aug 10, 2015
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
215 changes: 123 additions & 92 deletions lib/main/lang/modules/building.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import path = require('path');
import fs = require('fs');
import {pathIsRelative, makeRelativePath} from "../../tsconfig/tsconfig";
import {consistentPath} from "../../utils/fsUtil";
import {createMap} from "../utils";
import {createMap, assign} from "../utils";

/** Lazy loaded babel tanspiler */
let babel: any;
Expand All @@ -31,6 +31,8 @@ export function emitFile(proj: project.Project, filePath: string): EmitOutput {
var emitDone = !output.emitSkipped;
var errors: TSError[] = [];

let sourceFile = services.getSourceFile(filePath);

// Emit is no guarantee that there are no errors
var allDiagnostics = services.getCompilerOptionsDiagnostics()
.concat(services.getSyntacticDiagnostics(filePath))
Expand All @@ -45,21 +47,27 @@ export function emitFile(proj: project.Project, filePath: string): EmitOutput {
});

{
let sourceMapContents: {[index:string]: any} = {};
output.outputFiles.forEach(o => {
mkdirp.sync(path.dirname(o.name));
let additionalEmits = runExternalTranspiler(o, proj, sourceMapContents);

if (!sourceMapContents[o.name]) {
// .js.map files will be written as an "additional emit" later.
fs.writeFileSync(o.name, o.text, "utf8");
}

additionalEmits.forEach(a => {
mkdirp.sync(path.dirname(a.name));
fs.writeFileSync(a.name, a.text, "utf8");
let sourceMapContents: {[index:string]: any} = {};
output.outputFiles.forEach(o => {
mkdirp.sync(path.dirname(o.name));
let additionalEmits = runExternalTranspiler(
filePath,
sourceFile.text,
o,
proj,
sourceMapContents
);

if (!sourceMapContents[o.name]) {
// .js.map files will be written as an "additional emit" later.
fs.writeFileSync(o.name, o.text, "utf8");
}

additionalEmits.forEach(a => {
mkdirp.sync(path.dirname(a.name));
fs.writeFileSync(a.name, a.text, "utf8");
})
});
});
}

var outputFiles = output.outputFiles.map((o) => o.name);
Expand All @@ -79,97 +87,120 @@ export function getRawOutput(proj: project.Project, filePath: string): ts.EmitOu
let services = proj.languageService;
let output : ts.EmitOutput;
if (proj.includesSourceFile(filePath)) {
output = services.getEmitOutput(filePath);
output = services.getEmitOutput(filePath);
} else {
output = {
outputFiles: [{name: filePath, text: Not_In_Context, writeByteOrderMark: false}],
emitSkipped: true
}
output = {
outputFiles: [{name: filePath, text: Not_In_Context, writeByteOrderMark: false}],
emitSkipped: true
}
}
return output;
}

function runExternalTranspiler(outputFile: ts.OutputFile, project: project.Project, sourceMapContents: {[index:string]: any}) : ts.OutputFile[] {
if (!isJSFile(outputFile.name) && !isJSSourceMapFile(outputFile.name)) {
return [];
}
function runExternalTranspiler(sourceFileName: string,
sourceFileText: string,
outputFile: ts.OutputFile,
project: project.Project,
sourceMapContents: {[index:string]: any}) : ts.OutputFile[] {

let settings = project.projectFile.project;
let externalTranspiler = settings.externalTranspiler;
if (!externalTranspiler) {
return [];
}
if (!isJSFile(outputFile.name) && !isJSSourceMapFile(outputFile.name)) {
return [];
}

if (isJSSourceMapFile(outputFile.name)) {
let sourceMapPayload = JSON.parse(outputFile.text);
let jsFileName = consistentPath(path.resolve(path.dirname(outputFile.name), sourceMapPayload.file));
sourceMapContents[outputFile.name] = {jsFileName: jsFileName, sourceMapPayload};
return [];
}
let settings = project.projectFile.project;
let externalTranspiler = settings.externalTranspiler;
if (!externalTranspiler) {
return [];
}

if (externalTranspiler.toLocaleLowerCase() === "babel") {
babel = require("babel");
if (isJSSourceMapFile(outputFile.name)) {
let sourceMapPayload = JSON.parse(outputFile.text);
let jsFileName = consistentPath(path.resolve(path.dirname(outputFile.name), sourceMapPayload.file));
sourceMapContents[outputFile.name] = {jsFileName: jsFileName, sourceMapPayload};
return [];
}

let babelOptions : any = {};
if (typeof externalTranspiler === 'string') {
externalTranspiler = {
name: externalTranspiler as string,
options: {}
}
}

let sourceMapFileName = getJSMapNameForJSFile(outputFile.name);
// We need this type guard to narrow externalTranspiler's type
if (typeof externalTranspiler === 'object') {
if (externalTranspiler.name.toLocaleLowerCase() === "babel") {
if (!babel) {
babel = require("babel")
}

let babelOptions: any = assign({}, externalTranspiler.options || {}, {
filename: outputFile.name
});

let sourceMapFileName = getJSMapNameForJSFile(outputFile.name);

if (sourceMapContents[sourceMapFileName]) {
babelOptions.inputSourceMap = sourceMapContents[sourceMapFileName].sourceMapPayload;
let baseName = path.basename(sourceFileName);
// NOTE: Babel generates invalid source map without consistent `sources` and `file`.
babelOptions.inputSourceMap.sources = [baseName];
babelOptions.inputSourceMap.file = baseName;
}
if (settings.compilerOptions.sourceMap) {
babelOptions.sourceMaps = true;
}
if (settings.compilerOptions.inlineSourceMap) {
babelOptions.sourceMaps = "inline";
}
if (!settings.compilerOptions.removeComments) {
babelOptions.comments = true;
}

let babelResult = babel.transform(outputFile.text, babelOptions);
outputFile.text = babelResult.code;

if (babelResult.map && settings.compilerOptions.sourceMap) {
let additionalEmit : ts.OutputFile = {
name: sourceMapFileName,
text : JSON.stringify(babelResult.map),
writeByteOrderMark: settings.compilerOptions.emitBOM
};

if (additionalEmit.name === "") {
// can't emit a blank file name - this should only be reached if the TypeScript
// language service returns the .js file before the .js.map file.
console.warn(`The TypeScript language service did not yet provide a .js.map name for file ${outputFile.name}`);
return [];
}

return [additionalEmit];
}

return [];
}
}

if (sourceMapContents[sourceMapFileName]) {
babelOptions.inputSourceMap = sourceMapContents[sourceMapFileName].sourceMapPayload;
}
if (settings.compilerOptions.sourceMap) {
babelOptions.sourceMaps = true;
}
if (settings.compilerOptions.inlineSourceMap) {
babelOptions.sourceMaps = "inline";
}
if (!settings.compilerOptions.removeComments) {
babelOptions.comments = true;
function getJSMapNameForJSFile(jsFileName: string) {
for (let jsMapName in sourceMapContents) {
if (sourceMapContents.hasOwnProperty(jsMapName)) {
if (sourceMapContents[jsMapName].jsFileName === jsFileName) {
return jsMapName;
}
}
}
return "";
}
}

let babelResult = babel.transform(outputFile.text, babelOptions);
outputFile.text = babelResult.code;

if (babelResult.map && settings.compilerOptions.sourceMap) {
let additionalEmit : ts.OutputFile = {
name: sourceMapFileName,
text : JSON.stringify(babelResult.map),
writeByteOrderMark: settings.compilerOptions.emitBOM
};

if (additionalEmit.name === "") {
// can't emit a blank file name - this should only be reached if the TypeScript
// language service returns the .js file before the .js.map file.
console.warn(`The TypeScript language service did not yet provide a .js.map name for file ${outputFile.name}`);
return [];
}

return [additionalEmit];
function isJSFile(fileName: string) {
return (path.extname(fileName).toLocaleLowerCase() === ".js");
}

return [];
}

function getJSMapNameForJSFile(jsFileName: string) {
for (let jsMapName in sourceMapContents) {
if (sourceMapContents.hasOwnProperty(jsMapName)) {
if (sourceMapContents[jsMapName].jsFileName === jsFileName) {
return jsMapName;
function isJSSourceMapFile(fileName: string) {
let lastExt = path.extname(fileName);
if (lastExt === ".map") {
return isJSFile(fileName.substr(0,fileName.length - 4));
}
}
return false;
}
return "";
}
}

function isJSFile(fileName: string) {
return (path.extname(fileName).toLocaleLowerCase() === ".js");
}

function isJSSourceMapFile(fileName: string) {
let lastExt = path.extname(fileName);
if (lastExt === ".map") {
return isJSFile(fileName.substr(0,fileName.length - 4));
}
return false;
}
4 changes: 2 additions & 2 deletions lib/main/tsconfig/tsconfig.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -116,7 +116,7 @@ interface TypeScriptProjectRawSpecification {
formatCodeOptions?: formatting.FormatCodeOptions; // optional: formatting options
compileOnSave?: boolean; // optional: compile on save. Ignored to build tools. Used by IDEs
buildOnSave?: boolean;
externalTranspiler?: string;
externalTranspiler?: string | { name: string; options?: any };
scripts?: { postbuild?: string };
}

Expand All @@ -133,7 +133,7 @@ export interface TypeScriptProjectSpecification {
compileOnSave: boolean;
buildOnSave: boolean;
package?: UsefulFromPackageJson;
externalTranspiler?: string;
externalTranspiler?: string | { name: string; options?: any };
scripts: { postbuild?: string };
}

Expand Down