Я использую .Net MVC Framework и пытаюсь отобразить файл jsx (React), который имеет импорт.Я включаю этот файл в страницу бритвы (cshtml) через стандартное внедрение Url.Content следующим образом:
<script src="@Url.Content("~/js/queue/QueueIndex.js")"></script>
<script>
ReactDOM.render(React.createElement(QueueIndex), document.getElementById("queue-index"));
jQuery(window).on("load scroll", function () {
'use strict'; // Start of use strict
// Loader
$("#dvLoading").fadeOut("fast");
});
</script>
Если у меня нет импорта вверху моего файла React (QueueIndex.jsx)страница загружается просто отлично.Тем не менее, я хотел бы импортировать пакет реагирующих таблиц, но если включить в мой файл QueueIndex.jsx какие-либо операции импорта, разрыв страницы.
Я получаю сообщение об ошибке «Требуется, не определено».
Я думаю, что решение где-то в использовании веб-пакета, вот мой конфиг:
const webpack = require("webpack");
const CleanWebpackPlugin = require('clean-webpack-plugin');
module.exports = {
entry: {
nhqueue: './wwwroot/js/queue/QueueIndex.jsx'
},
output: {
path: __dirname + '/wwwroot/js/',
publicPath: '/wwwroot/js/',
filename: '[name].bundle.js'
},
module: {
preLoaders: [
],
loaders: [
{
test: /\.css$/,
loader: "style-loader!css-loader"
},
{ test: /\.tsx?$/, loaders: ['babel', 'ts'] },
{ test: /\.json$ /, loader: "json-loader" },
{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: "babel",
query:
{
presets: ['react']
}
}
],
externals: {
"moment": "moment",
},
},
devtool: 'source-map',
target: 'web',
plugins: [
new CleanWebpackPlugin(['./wwwroot/js/*.js'], {
root: __dirname,
verbose: true,
dry: false
}),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify('production')
}
}),
new webpack.optimize.UglifyJsPlugin()
],
resolve: {
extensions: ['', '.jsx', '.js', '.tsx', '.ts']
},
node: {
fs: "empty",
child_process: "empty"
}
}
К сожалению, мне там не повезло.Пожалуйста, дайте мне знать, если у вас есть идеи, как решить эту проблему.Спасибо!
Также вот конфигурация Babel:
{"presets" : ["es2015", "react"]}