react.js - React using a minified copy of the development build of React?
本文介绍了react.js - React using a minified copy of the development build of React?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
1:React-Router 编译报错It looks like you're using a minified copy of the development build of React?
2:代码如下:index.js
import React from 'react'
import { Router, Route, Link ,hashHistory } from 'react-router'
import ReactDOM from 'react-dom';
const App = React.createClass({
render() {
return (
<div>
<h1>App</h1>
<ul>
<li><Link to="/about">About</Link></li>
<li><Link to="/inbox">Inbox</Link></li>
</ul>
{this.props.children}
</div>
)
}
})
const About = React.createClass({
render() {
return <h3>About</h3>
}
})
const Inbox = React.createClass({
render() {
return (
<div>
<h2>Inbox</h2>
{this.props.children || 'Welcome to your Inbox'}
</div>
)
}
})
const Message = React.createClass({
render() {
return <h3>Message {this.props.params.id}</h3>
}
})
ReactDOM.render((
<Router history={hashHistory}>
<Route path="/" component={App}>
<Route path="about" component={About} />
<Route path="inbox" component={Inbox}>
<Route path="messages/:id" component={Message} />
</Route>
</Route>
</Router>
), document.getElementById('app'))
index.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title></title>
</head>
<body>
<div id="app">
</div>
</body>
</html>
3:编译后警告信息:
解决方案
webpack 配置添加 webpack.DefinePlugin 插件,更改NODE_ENV
module.exports = {
//...
plugins:[
new webpack.DefinePlugin({
'process.env':{
'NODE_ENV': JSON.stringify('production')
}
}),
.......
})
]
//...
}
这篇关于react.js - React using a minified copy of the development build of React?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文