[go: nahoru, domu]

Skip to content

Commit

Permalink
Allow transforming to any format
Browse files Browse the repository at this point in the history
This changes around `utils/use_require.js` to be able to generate any
of AMD (RequireJS), CommonJS, SystemJS, or UMD modules.  The three
former also include support for translating `vnc.html`, producing a full
"app" version of noVNC.
  • Loading branch information
DirectXMan12 committed Mar 7, 2017
1 parent 4faaf43 commit 6cae7b5
Show file tree
Hide file tree
Showing 4 changed files with 143 additions and 105 deletions.
12 changes: 7 additions & 5 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,7 @@
},
"scripts": {
"test": "PATH=$PATH:node_modules/karma/bin karma start karma.conf.js",
"prepublish": "node ./utils/use_require.js --as-require",
"build-es6": "node ./utils/use_require.js"
"prepublish": "node ./utils/use_require.js --as commonjs"
},
"repository": {
"type": "git",
Expand All @@ -29,10 +28,14 @@
"homepage": "https://github.com/kanaka/noVNC",
"devDependencies": {
"ansi": "^0.3.1",
"babel-core": "^6.22.1",
"babel-plugin-add-module-exports": "^0.2.1",
"babel-plugin-transform-es2015-modules-amd": "^6.22.0",
"babel-plugin-transform-es2015-modules-commonjs": "^6.18.0",
"babelify": "^7.3.0",
"babel-plugin-transform-es2015-modules-systemjs": "^6.22.0",
"babel-plugin-transform-es2015-modules-umd": "^6.22.0",
"browser-es-module-loader": "^0.4.1",
"babelify": "^7.3.0",
"browserify": "^13.1.0",
"casperjs": "^1.1.3",
"chai": "^3.5.0",
Expand All @@ -55,7 +58,6 @@
"sinon": "^1.17.6",
"sinon-chai": "^2.8.0",
"spooky": "^0.2.5",
"temp": "^0.8.3",
"through2": "^2.0.1"
"temp": "^0.8.3"
}
}
25 changes: 0 additions & 25 deletions utils/make-module-transform.js

This file was deleted.

171 changes: 96 additions & 75 deletions utils/use_require.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,118 +4,139 @@ var path = require('path');
var program = require('commander');
var fs = require('fs');
var fse = require('fs-extra');
var browserify = require('browserify');

var make_modules_transform = require('./make-module-transform');
var babelify = require("babelify");

const SUPPORTED_FORMATS = new Set(['amd', 'commonjs', 'systemjs', 'umd']);

program
.option('-b, --browserify', 'create a browserify bundled app')
.option('--as-require', 'output files using "require" instead of ES6 import and export')
.option('--as [format]', `output files using various import formats instead of ES6 import and export. Supports ${Array.from(SUPPORTED_FORMATS)}.`)
.option('-m, --with-source-maps [type]', 'output source maps when not generating a bundled app (type may be empty for external source maps, inline for inline source maps, or both) ')
.option('--with-app', 'process app files as well as core files')
.parse(process.argv);

// the various important paths
var main_path = path.resolve(__dirname, '..');
var core_path = path.resolve(__dirname, '..', 'core');
var app_path = path.resolve(__dirname, '..', 'app');
var vendor_path = path.resolve(__dirname, '..', 'vendor');
var out_dir_base = path.resolve(__dirname, '..', 'build');
var lib_dir_base = path.resolve(__dirname, '..', 'lib');

var make_browserify = function (src_files, opts) {
// change to the root noVNC directory
process.chdir(path.resolve(__dirname, '..'));

var b = browserify(src_files, opts);

// register the transforms
b.transform(make_modules_transform);
b.transform(babelify,
{ plugins: ["add-module-exports", "transform-es2015-modules-commonjs"] });

return b;
};

var make_full_app = function () {
// make sure the output directory exists
fse.ensureDir(out_dir_base);
// walkDir *recursively* walks directories trees,
// calling the callback for all normal files found.
var walkDir = function (base_path, cb) {
fs.readdir(base_path, (err, files) => {
if (err) throw err;

// actually bundle the files into a browserified bundled
var ui_file = path.join(app_path, 'ui.js');
var b = make_browserify(ui_file, {});
var app_file = path.join(out_dir_base, 'app.js');
b.bundle().pipe(fs.createWriteStream(app_file));
files.map((filename) => path.join(base_path, filename)).forEach((filepath) => {
fs.lstat(filepath, (err, stats) => {
if (err) throw err;

// copy over app-related resources (images, styles, etc)
var src_dir_app = path.join(__dirname, '..', 'app');
fs.readdir(src_dir_app, function (err, files) {
if (err) { throw err; }

files.forEach(function (src_file) {
var src_file_path = path.resolve(src_dir_app, src_file);
var out_file_path = path.resolve(out_dir_base, src_file);
var ext = path.extname(src_file);
if (ext === '.js' || ext === '.html') return;
fse.copy(src_file_path, out_file_path, function (err) {
if (err) { throw err; }
console.log("Copied file(s) from " + src_file_path + " to " + out_file_path);
if (stats.isSymbolicLink()) return;
if (stats.isFile()) cb(filepath);
if (stats.isDirectory()) walkDir(filepath, cb);
});
});
});
};

var transform_html = function (new_script) {
// write out the modified vnc.html file that works with the bundle
var src_html_path = path.resolve(__dirname, '..', 'vnc.html');
var out_html_path = path.resolve(out_dir_base, 'vnc.html');
fs.readFile(src_html_path, function (err, contents_raw) {
fs.readFile(src_html_path, (err, contents_raw) => {
if (err) { throw err; }

var contents = contents_raw.toString();
contents = contents.replace(/="app\//g, '="');

var start_marker = '<!-- begin scripts -->\n';
var end_marker = '<!-- end scripts -->';
var start_ind = contents.indexOf(start_marker) + start_marker.length;
var end_ind = contents.indexOf(end_marker, start_ind);

contents = contents.slice(0, start_ind) + '<script src="app.js"></script>\n' + contents.slice(end_ind);
contents = contents.slice(0, start_ind) + `${new_script}\n` + contents.slice(end_ind);

console.log(`Writing ${out_html_path}`);
fs.writeFile(out_html_path, contents, function (err) {
if (err) { throw err; }
console.log("Wrote " + out_html_path);
});
});
};
}

var make_lib_files = function (use_require) {
// make sure the output directory exists
fse.ensureDir(lib_dir_base);

var through = require('through2');

var deps = {};
var rfb_file = path.join(core_path, 'rfb.js');
var b = make_browserify(rfb_file, {});
b.on('transform', function (tr, file) {
if (tr._is_make_module) {
var new_path = path.join(lib_dir_base, path.relative(core_path, file));
fse.ensureDir(path.dirname(new_path));
console.log("Writing " + new_path)
var fileStream = fs.createWriteStream(new_path);

if (use_require) {
var babelificate = babelify(file,
{ plugins: ["add-module-exports", "transform-es2015-modules-commonjs"] });
tr.pipe(babelificate);
tr = babelificate;
var make_lib_files = function (import_format, source_maps, with_app_dir) {
if (!import_format) {
throw new Error("you must specify an import format to generate compiled noVNC libraries");
} else if (!SUPPORTED_FORMATS.has(import_format)) {
throw new Error(`unsupported output format "${import_format}" for import/export -- only ${Array.from(SUPPORTED_FORMATS)} are supported`);
}

// NB: we need to make a copy of babel_opts, since babel sets some defaults on it
const babel_opts = () => ({
plugins: [`transform-es2015-modules-${import_format}`],
ast: false,
sourceMaps: source_maps,
});
const babel = require('babel-core');

var in_path;
if (with_app_dir) {
var out_path_base = out_dir_base;
in_path = main_path;
} else {
var out_path_base = lib_dir_base;
}

fse.ensureDirSync(out_path_base);

const helpers = require('./use_require_helpers');
const helper = helpers[import_format];

var handleDir = (js_only, in_path_base, filename) => {
const out_path = path.join(out_path_base, path.relative(in_path_base, filename));
if(path.extname(filename) !== '.js') {
if (!js_only) {
console.log(`Writing ${out_path}`);
fse.copy(filename, out_path, (err) => { if (err) throw err; });
}
tr.pipe(fileStream);
return; // skip non-javascript files
}
});

b.bundle();
fse.ensureDir(path.dirname(out_path), () => {
const opts = babel_opts();
if (helper && helpers.optionsOverride) {
helper.optionsOverride(opts);
}
babel.transformFile(filename, babel_opts(), (err, res) => {
console.log(`Writing ${out_path}`);
if (err) throw err;
var {code, map, ast} = res;
if (source_maps === true) {
// append URL for external source map
code += `\n//# sourceMappingURL=${path.basename(out_path)}.map\n`;
}
fs.writeFile(out_path, code, (err) => { if (err) throw err; });
if (source_maps === true || source_maps === 'both') {
console.log(` and ${out_path}.map`);
fs.writeFile(`${out_path}.map`, JSON.stringify(map), (err) => { if (err) throw err; });
}
});
});
};

walkDir(core_path, handleDir.bind(null, true, in_path || core_path));
walkDir(vendor_path, handleDir.bind(null, true, in_path || main_path));

if (with_app_dir) {
walkDir(app_path, handleDir.bind(null, false, in_path || app_path));

const out_app_path = path.join(out_path_base, 'app.js');
if (helper && helper.appWriter) {
console.log(`Writing ${out_app_path}`);
let out_script = helper.appWriter(out_path_base, out_app_path);
transform_html(out_script);
} else {
console.error(`Unable to generate app for the ${import_format} format!`);
}
}
};

if (program.browserify) {
make_full_app();
} else {
make_lib_files(program.asRequire);
}
make_lib_files(program.as, program.withSourceMaps, program.withApp);
40 changes: 40 additions & 0 deletions utils/use_require_helpers.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
// writes helpers require for vnc.html (they should output app.js)
var fs = require('fs');
var fse = require('fs-extra');
var path = require('path');

module.exports = {
'amd': {
appWriter: (base_out_path, out_path) => {
// setup for requirejs
fs.writeFile(out_path, 'requirejs(["app/ui"], function (ui) {});', (err) => { if (err) throw err; });
console.log(`Please place RequireJS in ${path.join(base_out_path, 'require.js')}`);
return `<script src="require.js" data-main="${path.relative(base_out_path, out_path)}"></script>`;
},
},
'commonjs': {
optionsOverride: (opts) => {
// CommonJS supports properly shifting the default export to work as normal
opts.plugins.unshift("add-module-exports");
},
appWriter: (base_out_path, out_path) => {
var browserify = require('browserify');
var b = browserify(path.join(base_out_path, 'app/ui.js'), {});
b.bundle().pipe(fs.createWriteStream(out_path));
return `<script src="${path.relative(base_out_path, out_path)}"></script>`;
},
},
'systemjs': {
appWriter: (base_out_path, out_path) => {
fs.writeFile(out_path, 'SystemJS.import("./app/ui.js");', (err) => { if (err) throw err; });
console.log(`Please place SystemJS in ${path.join(base_out_path, 'system-production.js')}`);
return `<script src="system-production.js"></script>\n<script src="${path.relative(base_out_path, out_path)}"></script>`;
},
},
'umd': {
optionsOverride: (opts) => {
// umd supports properly shifting the default export to work as normal
opts.plugins.unshift("add-module-exports");
},
},
}

0 comments on commit 6cae7b5

Please sign in to comment.