From 1a0fc7ab2a6c4a84342ad36904fd2a3f33c1b7d5 Mon Sep 17 00:00:00 2001 From: Tomas Varga Date: Tue, 30 Jan 2018 17:25:59 +0100 Subject: [PATCH] Initial commit - the working setup --- .babelrc | 5 +++++ .gitignore | 1 + README.md | 12 ++++++++++++ index.html | 20 ++++++++++++++++++++ index.js | 7 +++++++ package-lock.json | 23 +++++++++++++++++++++++ package.json | 23 +++++++++++++++++++++++ src/utils.js | 4 ++++ system.config.js | 15 +++++++++++++++ 9 files changed, 110 insertions(+) create mode 100644 .babelrc create mode 100644 .gitignore create mode 100644 README.md create mode 100644 index.html create mode 100644 index.js create mode 100644 package-lock.json create mode 100644 package.json create mode 100644 src/utils.js create mode 100644 system.config.js diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..b207aef --- /dev/null +++ b/.babelrc @@ -0,0 +1,5 @@ +{ + "presets": [ + "env" + ] +} diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..c2658d7 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +node_modules/ diff --git a/README.md b/README.md new file mode 100644 index 0000000..f643ef2 --- /dev/null +++ b/README.md @@ -0,0 +1,12 @@ +# SystemJS minimal ES2015 setup + +A minimal SystemJS module loader setup with ES2015 support. + +## Usage + +Just install dependencies & point a webserver to (or run it in) the project's root. + +``` +npm install +http-server +``` diff --git a/index.html b/index.html new file mode 100644 index 0000000..bcd4e30 --- /dev/null +++ b/index.html @@ -0,0 +1,20 @@ + + + + + SystemJS es2015 Sample + + +
+ + + + + + + diff --git a/index.js b/index.js new file mode 100644 index 0000000..7bd530f --- /dev/null +++ b/index.js @@ -0,0 +1,7 @@ +import { showMessage } from './src/utils'; + +console.log('Hello from es5!'); +setTimeout(() => { + console.log('Hello from es6!'); + showMessage('Hello from es6!', '#whatever-app'); +}, 0); diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..5d4414b --- /dev/null +++ b/package-lock.json @@ -0,0 +1,23 @@ +{ + "name": "systemjs-es2015-sample", + "version": "0.0.1", + "lockfileVersion": 1, + "requires": true, + "dependencies": { + "promise-polyfill": { + "version": "6.0.2", + "resolved": "https://registry.npmjs.org/promise-polyfill/-/promise-polyfill-6.0.2.tgz", + "integrity": "sha1-2chtPcTcLfkBboiUbe/Wm0m0EWI=" + }, + "systemjs": { + "version": "0.20.18", + "resolved": "https://registry.npmjs.org/systemjs/-/systemjs-0.20.18.tgz", + "integrity": "sha512-i/v5cx79piwoKk+dUMgZ8LNMOc2ieILqCO7XPrulfDzG0dp9+9d3errwBkyb0rUshdmR97noKj9tixNm7itbdA==" + }, + "systemjs-plugin-babel": { + "version": "0.0.25", + "resolved": "https://registry.npmjs.org/systemjs-plugin-babel/-/systemjs-plugin-babel-0.0.25.tgz", + "integrity": "sha512-RMKSizWWlw4+IpDB385ugxn7Owd9W+HEtjYDQ6yO1FpsnER/vk6FbXRweUF+mvRi6EHgk8vDdUdtui7ReDwX3w==" + } + } +} diff --git a/package.json b/package.json new file mode 100644 index 0000000..e758ac7 --- /dev/null +++ b/package.json @@ -0,0 +1,23 @@ +{ + "name": "systemjs-es2015-minimal", + "version": "0.0.1", + "description": "A minimal SystemJS module loader setup with ES2015 support.", + "main": "index.js", + "scripts": { + "test": "echo \"Error: no test specified\" && exit 1" + }, + "keywords": [ + "systemjs", + "babel", + "es2015", + "starter", + "sample" + ], + "author": "Tomas Varga ", + "license": "ISC", + "dependencies": { + "promise-polyfill": "^6.0.2", + "systemjs": "^0.20.18", + "systemjs-plugin-babel": "0.0.25" + } +} diff --git a/src/utils.js b/src/utils.js new file mode 100644 index 0000000..ff0899b --- /dev/null +++ b/src/utils.js @@ -0,0 +1,4 @@ +export const showMessage = (message, elemSelector) => { + var elem = document.querySelector(elemSelector); + if (elem) elem.innerHTML = message; +}; diff --git a/system.config.js b/system.config.js new file mode 100644 index 0000000..432f9c8 --- /dev/null +++ b/system.config.js @@ -0,0 +1,15 @@ +/* global System */ + +System.config({ + packages: { + '.': { defaultExtension: 'js' } + }, + meta: { + '.': { format: 'esm' }, + }, + map: { + 'plugin-babel': 'node_modules/systemjs-plugin-babel/plugin-babel.js', + 'systemjs-babel-build': 'node_modules/systemjs-plugin-babel/systemjs-babel-browser.js' + }, + transpiler: 'plugin-babel' +});