app.js
import React from 'react';
import Hello from './hello.jsx';
main();
function main() {
React.render( , document.getElementById('app'));
}
hello.jsx
import React from 'react';
export default class Hello extends React.Component {
render() {
return Hello world
;
}
}
webpack.config.js
var path = require('path');
var config = {
entry: path.resolve(__dirname, 'main.js'),
output: {
path: path.resolve(__dirname, 'build'),
filename: 'bundle.js'
},
module: {
loaders: [{
test: /\.jsx?$/,
loader: 'babel'
}]
}
};
module.exports = config;
webpack执行结果
Hash: c02ddfd9c43ddfa17021
Version: webpack 2.1.0-beta.5
Time: 8695ms
Asset Size Chunks Chunk Names
bundle.js 619 kB 0 [emitted] main
158 hidden modules
测试页面
浏览器显示无结果,但是控制台报错 SyntaxError: class is a reserved identifier @ http://localhost/build/bundle.js:10097
Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
添加一个.babelrc文件,然后添加如下代码
记得安装babel-preset-es2015和babel-preset-react,babel-preset-stage-0
包名写错了