npm init
npm install webpack webpack-cli babel-loader @babel/core @babel/preset-react --save-dev
script
const path = require('path');
module.exports = {
entry: './src/main/js/app.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'bundle.js'
},
module: {
rules: [
{
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-react']
}
}
}
]
},
resolve: {
extensions: ['.js', '.jsx']
}
};
script
import React from 'react';
import ReactDOM from 'react-dom';
class App extends React.Component {
render() {
return <h1>Hello, Java React!</h1>;
}
}
ReactDOM.render(<App />, document.getElementById('root'));
html
<!DOCTYPE html>
<html>
<head>
<title>Java React</title>
</head>
<body>
<div id="root"></div>
<script src="./dist/bundle.js"></script>
</body>
</html>
npx webpack