├── .gitignore ├── README.md ├── index.html ├── package-lock.json ├── package.json ├── src └── index.js └── webpack.config.js /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | dist/ 3 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Get started 2 | =========== 3 | 4 | This is an example setup for react-materialize and webpack. 5 | 6 | run the example with: 7 | 8 | npm install 9 | npm install react-materialize@latest 10 | npm start 11 | 12 | open http://localhost:8080/ 13 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | react-materialize boilplate 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "test-material", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1", 8 | "build": "webpack --colors --progress", 9 | "start": "webpack-serve" 10 | }, 11 | "author": "", 12 | "license": "ISC", 13 | "dependencies": { 14 | "jquery": "^3.3.1", 15 | "materialize-css": "^0.100.2", 16 | "react": "^16.4.1", 17 | "react-dom": "^16.4.1", 18 | "react-materialize": "^2.3.3", 19 | "webpack": "^4.16.0" 20 | }, 21 | "devDependencies": { 22 | "@babel/core": "^7.0.0-beta.53", 23 | "@babel/preset-env": "^7.0.0-beta.53", 24 | "@babel/preset-react": "^7.0.0-beta.53", 25 | "babel-loader": "^8.0.0-beta.4", 26 | "error-overlay-webpack-plugin": "^0.1.5", 27 | "webpack-serve": "^2.0.2" 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import { Dropdown, Button } from 'react-materialize'; 4 | 5 | const App = ({name}) => 6 | Drop me! 8 | }> 9 |

Hello

10 |

Hello

11 |

Hello

12 |

Bye

13 |
; 14 | 15 | ReactDOM.render( 16 | , document.getElementById('root') 17 | ); 18 | -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | const webpack = require('webpack'); 3 | const ErrorOverlayPlugin = require('error-overlay-webpack-plugin') 4 | 5 | module.exports = { 6 | mode: 'development', 7 | entry: './src/index.js', 8 | output: { 9 | path: path.join(__dirname, 'dist'), 10 | filename: 'bundle.js' 11 | }, 12 | devtool: 'cheap-module-source-map', 13 | module: { 14 | rules: [ 15 | { 16 | test: /\.js$/, 17 | exclude: /node_modules/, 18 | loader: 'babel-loader', 19 | query: { 20 | presets: ['@babel/react', '@babel/preset-env'] 21 | } 22 | } 23 | ] 24 | }, 25 | plugins: [new ErrorOverlayPlugin()] 26 | }; 27 | --------------------------------------------------------------------------------