我对react.js很新。请原谅我这个问题太傻了 我想建立一个折线图。我决定继续使用react.js,chart.js和react-chartjs.min.js。
我在我的cshtml中包含了react-chartjs.min的脚本,我也添加了jsx文件。
现在我面临一个错误,我不会在哪里出错。
demo.jsx给出 - 未捕获的ReferenceError:未定义的需求
<div id="content" class="myDiv" ></div>
<script src="~/Scripts/react.js"></script>
<script src="~/Scripts/react-dom.js"></script>
<script src="~/Scripts/remarkable.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/react-chartjs/0.8.0/react-chartjs.min.js'></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.34/browser.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.34/browser-polyfill.js"></script>
<script src="@Url.Content("~/Scripts/Custom/demo.jsx")"></script>
</div>
var LineChart = require(&#34; react-chartjs&#34;)。Line;
webpack.config.js
module.exports = {
entry: "./Scripts/Custom/OrderReleaseItems.jsx",
output: {
filename: "./dist/bundle.js"
},
devServer: {
contentBase: ".",
host: "localhost",
port: 15878
},
module: {
loaders: [
{
test: /\.jsx?$/,
loader: "babel-loader"
}
]
}, plugins: [
new webpack.ProvidePlugin({
'React': 'react',
'$': 'jquery',
'_': 'lodash',
'ReactDOM': 'react-dom',
'cssModule': 'react-css-modules',
'Promise': 'bluebird'
})
]
};
答案 0 :(得分:0)
你必须按照react-chartjs
的例子中的说明导入Lineimport {Line} from 'react-chartjs-2';
此外,你必须使用bable来构建它。