My question is how to make the script appear that connects the assembled file from the webpack. This is a pug

include layout sctipt(type='text/babel' src='/client/bundle.js') #content 

In webpack

 const path = require("path"); module.exports = { entry: __dirname + "/public/js/AuthForm.js", output: { filename: "bundle.js", path: path.resolve(__dirname + "/public/client") }, module: { rules: [ { test: /\.js$/, exclude: /node_modules/, loader: "babel-loader" }, { test: /\.jsx$/, exclude: /node_modules/, loader: "babel-loader" } ] } }; 

In .babelrc

 { "presets": [ "es2015", "react", "stage-0" ] } 

And in the AuthForm.js file itself, a simple code

 import React from 'react'; import ReactDOM from 'react-dom'; ReactDOM.render( <h1>Hello world!</h1>, document.getElementById('content') ); 
Only when I collected everything

 C:\OpenServer\domains\trainingPortal>npx webpack --config webpack.config.js npx: installed 1 in 1.823s Path must be a string. Received undefined C:\OpenServer\domains\trainingPortal\node_modules\webpack\bin\webpack.js Hash: 9a12974da47514bba93f Version: webpack 3.10.0 Time: 1248ms Asset Size Chunks Chunk Names bundle.js 727 kB 0 [emitted] [big] main [14] ./public/js/AuthForm.js 418 bytes {0} [built] + 26 hidden modules 

Then I do not get the inscription Hello world, Although according to my logic, it should go

  • you have not gathered because of the wrong way, try to put it in quotes - Sasha Borichevsky
  • @SashaBorichevsky Yes, everything seems to be fine. And how do you know what is going wrong? - Ruslan
  • @SashaBorichevsky If it matters, then I have node js. On clean code without a server, I did it right - Ruslan
  • Why type='text/babel' ? You drive him through the Babel-loader, there is the usual js at the exit - Daniel Khoroshko

1 answer 1

 $ cat .babelrc { .... "presets": [ "react", <- это раз "es2015", "stage-0" ] } $ cat package.json { .... "devDependencies": { .... "babel-preset-es2015": "^6.22.0", "babel-preset-react": "^6.23.0", <- это два "babel-preset-stage-0": "^6.22.0", .... } }