Пожалуйста, подскажите:
Пытаюсь освоить всю эту ноджеэсовскую кухню, компиляцию js кода в исполняемые модули через Webpack. Боле-менее получается, но споткнулся на babel. Создал вот такой тестовый файл dgtest.js на примере с метанита, пытаюсь прогнать его через webpack с применением babel.
class Hello extends React.Component {
render() {
return <h1>Hello, React</h1>;
}
}
ReactDOM.render(
<Hello></Hello>,
document.getElementById("app")
)
Получаю ошибку
"locals[0] does not appear to be a `module` object with Hot Module replacement API enabled. You should disable react-transform-hmr in production by using `env` section in Babel configuration. See the example in "
Гуглил. Пытался вставить предложенные конфигурации с SO в секцию "babel" в package.json - не работает.
Подскажите, пожалуйста, как с этим бороться. Ну и заодно хотел уточнить, нужно ли перед этим кодом вставлять require("react") и/или require("babel")?
Использую Visual Studio.
webpack.config.jsvar path = require('path');
module.exports = {
entry: {
react: './node_modules/react/index',
reactdom: './node_modules/react-dom/index',
datagrid: './node_modules/react-data-grid/index',
addons: './node_modules/react-data-grid-addons/index',
jquery: './node_modules/jquery/src/jquery',
dgtest: './wp/Scripts/dgtest.js'
},
output: {
publicPath: "/js/",
path: path.join(__dirname, '/wp/wwwroot/js/'),
filename: "[name].bundle.js",
chunkFilename: "[id].bundle.js"
},
module:
{
loaders: [
{
test: /\.js$/,
loader: 'babel-loader',
exclude: /node_modules/,
query: {
presets: ['react', 'es2015', 'react-hmre'],
plugins: ['transform-class-properties'],
}
}
]
}
};
package.json{
"name": "wp",
"version": "1.0.0",
"description": "",
"main": "webpack.config.js",
"dependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.2",
"babel-preset-react-hmre": "^1.1.1",
"jquery": "^3.2.1",
"react": "^16.0.0",
"react-data-grid": "^2.0.69",
"react-data-grid-addons": "^2.0.70",
"react-dom": "^16.0.0",
"webpack": "^3.8.1",
"webpack-notifier": "^1.5.0"
},
"devDependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.2",
"babel-plugin-react-transform": "^3.0.0",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-register": "^6.26.0",
"react-transform-hmr": "^1.0.4",
"webpack": "^3.8.1"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "webpack"
},
"keywords": [],
"author": "",
"license": "ISC",
"babel": {}
}
