Getting started with Traceur
Install Traceur
Make sure you have node.js installed and npm updated.
Create package.json file:
npm init -yInstall Traceur with the following command:
npm i --save-dev traceurConfigure
Add traceur to scripts section of package.json:
traceur --script src/index.js --out dist/index.js --outputLanguage es5 --source-maps file --source-root true Create html and js
Create src folder for source files and dist for transpiled output.
Create file src/index.js written in ES2015:
const greetings = `Hello World!`;
document.body.innerHTML += greetings;Create index.html:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Tracuer Sample</title>
</head>
<body>
<script src="node_modules/traceur/bin/traceur-runtime.js"></script>
<script src="dist/index.js"></script>
</body>
</html>Run Traceur
Run command:
npm run buildLoad webpage
Open index.html and see output
Debug
Open debugger (Ctrl-Shift-I in Chrome) and navigate to source code, inspect output