Commit 4cbb28e1 authored by Michael Bebenita's avatar Michael Bebenita
Browse files

React Template.

parent 568f5c5b
This is an (incomplete) list of people who have contributed to the
codebase which lives in this repository. If you make a contribution
here, you may add your name and, optionally, email address in the
appropriate place.
Andre Natal <anatal@mozilla.com>
Michael Bebenita <mbebenita@gmail.com>
# VoiceBank
## Install & Build
```
npm install && npm run build-release
```
## Development Setup
To build VoiceBank automatically whenever a file changes run:
```
npm run build-watch
```
\ No newline at end of file
var path = require('path');
var webpack = require('webpack');
module.exports = {
entry: {
vb: "./src/main.tsx",
},
output: {
path: path.resolve(__dirname, '../dist'),
filename: "[name].bundle.js"
},
resolve: {
// Add '.ts' and '.tsx' as resolvable extensions.
extensions: [".webpack.js", ".web.js", ".ts", ".tsx", ".js"],
// alias: { 'react': path.resolve(__dirname, 'node_modules', 'react') }
},
module: {
loaders: [
// All files with a '.ts' or '.tsx' extension will be handled by 'ts-loader'.
{ test: /\.tsx?$/, loader: "ts-loader" }
]
// preLoaders: [
// // All output '.js' files will have any sourcemaps re-processed by 'source-map-loader'.
// { test: /\.js$/, loader: "source-map-loader" }
// ]
},
// When importing a module whose path matches one of the following, just
// assume a corresponding global variable exists and use that instead.
// This is important because it allows us to avoid bundling all of our
// dependencies, which allows browsers to cache those libraries between builds.
externals: {
// "react": "React",
// "react-dom": "ReactDOM"
},
};
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>VoiceBank</title>
<style>
html,
body {
height: 100%;
margin: 0px;
background-color: #222222;
min-height: 100%;
color: white;
}
</style>
</head>
<body>
<div id="app">
</div>
<script src="./dist/vb.bundle.js"></script>
</body>
</html>
{
"name": "VoiceBank",
"version": "1.0.0",
"description": "VoiceBank",
"main": "index.js",
"scripts": {
"build": "webpack --config config/webpack.config.js",
"build-watch": "webpack --watch --config config/webpack.config.js",
"build-debug": "webpack --display-reasons --progress --config config/webpack.config.js",
"build-release": "webpack -p --config config/webpack.config.js"
},
"author": "Mozilla",
"license": "ISC",
"devDependencies": {
"@types/react": "^0.14.33",
"@types/react-dom": "^0.14.16",
"ts-loader": "^2.0.3",
"typescript": "^2.2.2",
"webpack": "^2.3.3"
},
"dependencies": {
"react": "^15.4.1",
"react-dom": "^15.4.1",
"react-tap-event-plugin": "^2.0.1"
}
}
import * as React from "react";
import * as ReactDOM from "react-dom";
import injectTapEventPluginRequire = require("react-tap-event-plugin");
// Needed for onTouchTap
// http://stackoverflow.com/a/34015469/988941
injectTapEventPluginRequire();
ReactDOM.render(
<div>Voice Bank</div>,
document.getElementById("app")
);
{
"compilerOptions": {
"outDir": "./dist/",
"sourceMap": true,
"noImplicitAny": true,
"module": "commonjs",
"target": "es5",
"jsx": "react",
"baseUrl": "src",
"moduleResolution": "node",
"noImplicitAny": false,
"sourceMap": true,
"allowSyntheticDefaultImports": true,
"lib": ["dom", "es6"]
},
"exclude": [
"node_modules"
]
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment