├── README.md ├── dist ├── bundle.js └── index.html ├── package.json ├── src └── app.js └── webpack.config.js /README.md: -------------------------------------------------------------------------------- 1 | # react-exapme 2 | A new React project using only webpack 3 | 4 | ## Run locally 5 | ``` 6 | npm install 7 | npm run dist 8 | open dist/index.html 9 | ``` 10 | -------------------------------------------------------------------------------- /dist/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | React example app 5 | 6 | 7 |
8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-example", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "dist": "webpack", 8 | "test": "echo \"Error: no test specified\" && exit 1" 9 | }, 10 | "author": "Muthu", 11 | "license": "ISC", 12 | "devDependencies": { 13 | "babel-core": "^6.25.0", 14 | "babel-loader": "^7.1.0", 15 | "babel-preset-es2015": "^6.24.1", 16 | "babel-preset-react": "^6.24.1", 17 | "webpack": "^3.0.0" 18 | }, 19 | "dependencies": { 20 | "react": "^15.6.1", 21 | "react-dom": "^15.6.1" 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /src/app.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDOM from "react-dom"; 3 | 4 | class HelloMessage extends React.Component { 5 | render() { 6 | return
Hello {this.props.name}
; 7 | } 8 | } 9 | 10 | var mountNode = document.getElementById("app"); 11 | ReactDOM.render(, mountNode); 12 | -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | const webpack = require('webpack'); 2 | const path = require('path'); 3 | const config = { 4 | entry: './src/app.js', 5 | output: { 6 | path: path.resolve(__dirname, 'dist'), 7 | filename: 'bundle.js' 8 | }, 9 | module: { 10 | rules: [ 11 | { 12 | test: /\.(js|jsx)$/, 13 | exclude: /node_modules/, 14 | use: 'babel-loader' 15 | } 16 | ] 17 | } 18 | }; 19 | module.exports = config; 20 | --------------------------------------------------------------------------------