Terminal:
Version: webpack 4.28.3
Time: 940ms
Built at: 02/19/2019 10:11:22 PM
1 asset
Entrypoint app = bundle.js
[0] ./client/src/index.js 4.6 KiB {0} [built] [failed] [1 error]
WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/concepts/mode/
ERROR in ./client/src/index.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: I:\React apps\reactexpress\client\src\index.js: Unexpected token (8:16)
6 | import * as serviceWorker from "./serviceWorker";
7 |
> 8 | ReactDOM.render(<App />, document.getElementById("root"));
| ^
9 |
10 | // If you want your app to work offline and load faster, you can change
11 | // unregister() to register() below. Note this comes with some pitfalls.
at Parser.raise (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:3831:17)
at Parser.unexpected (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:5143:16)
at Parser.parseExprAtom (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:6283:20)
at Parser.parseExprSubscripts (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:5862:23)
at Parser.parseMaybeUnary (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:5842:21)
at Parser.parseExprOps (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:5729:23)
at Parser.parseMaybeConditional (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:5702:23)
at Parser.parseMaybeAssign (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:5647:21)
at Parser.parseExprListItem (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:6940:18)
at Parser.parseCallExpressionArguments (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:6070:22)
at Parser.parseSubscript (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:5965:29)
at Parser.parseSubscripts (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:5882:19)
at Parser.parseExprSubscripts (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:5872:17)
at Parser.parseMaybeUnary (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:5842:21)
at Parser.parseExprOps (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:5729:23)
at Parser.parseMaybeConditional (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:5702:23)
at Parser.parseMaybeAssign (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:5647:21)
at Parser.parseExpression (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:5595:23)
at Parser.parseStatementContent (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:7378:23)
at Parser.parseStatement (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:7243:17)
at Parser.parseBlockOrModuleBlockBody (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:7810:25)
at Parser.parseBlockBody (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:7797:10)
at Parser.parseTopLevel (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:7181:10)
at Parser.parse (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:8658:17)
at parse (I:\React apps\reactexpress\node_modules\@babel\parser\lib\index.js:10658:38)
at parser (I:\React apps\reactexpress\node_modules\@babel\core\lib\transformation\normalize-file.js:170:34)
at normalizeFile (I:\React apps\reactexpress\node_modules\@babel\core\lib\transformation\normalize-file.js:138:11)
at runSync (I:\React apps\reactexpress\node_modules\@babel\core\lib\transformation\index.js:44:43)
at runAsync (I:\React apps\reactexpress\node_modules\@babel\core\lib\transformation\index.js:35:14)
at process.nextTick (I:\React apps\reactexpress\node_modules\@babel\core\lib\transform.js:34:34)
at process._tickCallback (internal/process/next_tick.js:61:11)
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! reactexpress@1.0.0 webpack: `webpack`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the reactexpress@1.0.0 webpack script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Jesal\AppData\Roaming\npm-cache\_logs\2019-02-19T22_11_22_659Z-debug.log
Debug Log:
0 info it worked if it ends with ok
1 verbose cli [ 'H:\\Node\\node.exe',
1 verbose cli 'C:\\Users\\Jesal\\AppData\\Roaming\\npm\\node_modules\\npm\\bin\\npm-cli.js',
1 verbose cli 'run',
1 verbose cli 'webpack' ]
2 info using npm@6.8.0
3 info using node@v10.15.1
4 verbose run-script [ 'prewebpack', 'webpack', 'postwebpack' ]
5 info lifecycle reactexpress@1.0.0~prewebpack: reactexpress@1.0.0
6 info lifecycle reactexpress@1.0.0~webpack: reactexpress@1.0.0
7 verbose lifecycle reactexpress@1.0.0~webpack: unsafe-perm in lifecycle true
8 verbose lifecycle reactexpress@1.0.0~webpack: PATH: C:\Users\Jesal\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;I:\React apps\reactexpress\node_modules\.bin;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Program Files\NVIDIA Corporation\NVIDIA NvDLISR;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\WINDOWS\System32\OpenSSH\;H:\Node\;C:\Program Files\Git\cmd;C:\Users\Jesal\AppData\Local\Microsoft\WindowsApps;C:\Users\Jesal\AppData\Roaming\npm;C:\Users\Jesal\AppData\Local\Programs\Microsoft VS Code\bin
9 verbose lifecycle reactexpress@1.0.0~webpack: CWD: I:\React apps\reactexpress
10 silly lifecycle reactexpress@1.0.0~webpack: Args: [ '/d /s /c', 'webpack' ]
11 silly lifecycle reactexpress@1.0.0~webpack: Returned: code: 2 signal: null
12 info lifecycle reactexpress@1.0.0~webpack: Failed to exec webpack script
13 verbose stack Error: reactexpress@1.0.0 webpack: `webpack`
13 verbose stack Exit status 2
13 verbose stack at EventEmitter.<anonymous> (C:\Users\Jesal\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\index.js:301:16)
13 verbose stack at EventEmitter.emit (events.js:189:13)
13 verbose stack at ChildProcess.<anonymous> (C:\Users\Jesal\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14)
13 verbose stack at ChildProcess.emit (events.js:189:13)
13 verbose stack at maybeClose (internal/child_process.js:970:16)
13 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:259:5)
14 verbose pkgid reactexpress@1.0.0
15 verbose cwd I:\React apps\reactexpress
16 verbose Windows_NT 10.0.17134
17 verbose argv "H:\\Node\\node.exe" "C:\\Users\\Jesal\\AppData\\Roaming\\npm\\node_modules\\npm\\bin\\npm-cli.js" "run" "webpack"
18 verbose node v10.15.1
19 verbose npm v6.8.0
20 error code ELIFECYCLE
21 error errno 2
22 error reactexpress@1.0.0 webpack: `webpack`
22 error Exit status 2
23 error Failed at the reactexpress@1.0.0 webpack script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 2, true ]
Note: I do have a .babelrc file with the following:
{
"presets": ["es2015", "react"]
}
My webpack.config.jsis below:
const path = require("path");
module.exports = {
entry: {
app: "./client/src/index.js"
},
output: {
filename: "bundle.js",
path: path.resolve(__dirname, "dist")
},
module: {
rules: [
{
test: /\.js$/, // include .js files
exclude: /node_modules/, // exclude any and all files in the node_modules folder
loader: "babel-loader"
},
{
test: /\.jsx$/, // include .js files
exclude: /node_modules/, // exclude any and all files in the node_modules folder
loader: "babel-loader"
}
]
}
};
I've tried possible avenues such as ones suggested in this post:
even though the errors are different in comparison to what I have which is specifically to do with webpack. I have searched the web to find anything that's similar to the problem I am having but to no avail. Any help would be greatly appreciated. Thanks in advance.
EDIT:
package.json (root folder level one - everything regards to back-end modules is on this file) is below:
{
"name": "reactexpress",
"version": "1.0.0",
"description": "Boilerplate for React and Express",
"main": "server.js",
"scripts": {
"client-install": "cd client && npm install",
"start": "node server.js",
"server": "nodemon server.js",
"client": "npm start --prefix client",
"dev": "concurrently \"npm run server\" \"npm run client\"",
"webpack": "node_modules/.bin/webpack"
},
"author": "Jesal Patel",
"license": "ISC",
"dependencies": {
"concurrently": "^4.1.0",
"express": "^4.16.4",
"react-dom": "^16.8.2"
},
"devDependencies": {
"@babel/core": "^7.3.3",
"@babel/preset-env": "^7.3.1",
"@babel/preset-react": "^7.0.0",
"babel": "^6.23.0",
"babel-cli": "^6.26.0",
"babel-loader": "^8.0.5",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"nodemon": "^1.18.10",
"webpack": "^4.28.3",
"webpack-cli": "^3.2.3"
}
}
On the image at the top shows my folder structure. Now everything that is backend is at the root which is 'reactexpress' and has a seperate package.jsonfile to the one inside the clientfolder which also contains the srcfolder which has all of my components such as App.js along with the index.js file. Not sure if that has any relevance to the problem but thought I'd post it on here anyway.
