ModusCreateOrg / ModusCreateOrg/react-dynamic-route-loading-es6

SyntaxError when builded, can't understand why

Open
#20 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
294
Forks
64
PR merge metrics
No merged PRs in 30d

Description

cloning your react-dynamic-route-loading-es6
when trying npm start

have ERROR in ./client/pages/Home/index.js
Module build failed: SyntaxError: Unexpected token (13:2)


  11 | 
  12 | export default () => (
> 13 |   <article className="home">
     |   ^
  14 |     <Header title="Home" className="header-dark" />
  15 |     <List columns={2} items={twoColListItems} />
  16 |   </article>

@ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server index pages/Home

full console

`[vasil@localhost webpack_split]$ sudo npm start

> react-router-dynamic-routes-webpack2@1.0.0 start /home/vasil/workplace/webpack_split
> webpack-dev-server --config webpack.config.js

Project is running at http://localhost:3000/
webpack output is served from /
Content not from webpack is served from ./client
404s will fallback to /index.html
(node:11765) DeprecationWarning: loaderUtils.parseQuery() received a non-string value which can be problematic, see https://github.com/webpack/loader-utils/issues/56
parseQuery() will be replaced with getOptions() in the next major version of loader-utils.
Hash: d36e34181bf36fbc7888
Version: webpack 2.2.0
Time: 2610ms
               Asset       Size  Chunks                    Chunk Names
           bundle.js    2.23 kB       0  [emitted]         js
    vendor.bundle.js    1.02 MB       1  [emitted]  [big]  vendor
       bundle.js.map  102 bytes       0  [emitted]         js
vendor.bundle.js.map     1.2 MB       1  [emitted]         vendor
          index.html  429 bytes          [emitted]         
chunk    {0} bundle.js, bundle.js.map (js) 1.75 kB {1} [initial] [rendered]
 [./index.js] ./client/index.js 595 bytes {0} [built] [failed] [1 error]
 [./pages/Home/index.js] ./client/pages/Home/index.js 1.09 kB {0} [built] [failed] [1 error]
    [0] multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server index pages/Home 64 bytes {0} [built]
chunk    {1} vendor.bundle.js, vendor.bundle.js.map (vendor) 936 kB [entry] [rendered]
 [../node_modules/ansi-regex/index.js] ./~/ansi-regex/index.js 135 bytes {1} [built]
 [../node_modules/fbjs/lib/ExecutionEnvironment.js] ./~/fbjs/lib/ExecutionEnvironment.js 1.06 kB {1} [built]
 [../node_modules/react-dom/index.js] ./~/react-dom/index.js 59 bytes {1} [built]
 [../node_modules/react-dom/lib/ReactDOM.js] ./~/react-dom/lib/ReactDOM.js 5.14 kB {1} [built]
 [../node_modules/react/lib/React.js] ./~/react/lib/React.js 2.69 kB {1} [built]
 [../node_modules/react/lib/ReactPropTypes.js] ./~/react/lib/ReactPropTypes.js 15.8 kB {1} [built]
 [../node_modules/react/react.js] ./~/react/react.js 56 bytes {1} [built]
 [../node_modules/strip-ansi/index.js] ./~/strip-ansi/index.js 161 bytes {1} [built]
    [1] multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server react react-dom 64 bytes {1} [built]
 [../node_modules/url/url.js] ./~/url/url.js 23.3 kB {1} [built]
 [../node_modules/webpack-dev-server/client/index.js?http:/localhost:3000] (webpack)-dev-server/client?http://localhost:3000 4.66 kB {1} [built]
 [../node_modules/webpack-dev-server/client/socket.js] (webpack)-dev-server/client/socket.js 856 bytes {1} [built]
 [../node_modules/webpack/hot/dev-server.js] (webpack)/hot/dev-server.js 1.57 kB {1} [built]
 [../node_modules/webpack/hot/emitter.js] (webpack)/hot/emitter.js 77 bytes {1} [built]
 [../node_modules/webpack/hot/log-apply-result.js] (webpack)/hot/log-apply-result.js 1.02 kB {1} [built]
     + 241 hidden modules

ERROR in ./client/pages/Home/index.js
Module build failed: SyntaxError: Unexpected token (13:2)

  11 | 
  12 | export default () => (
> 13 |   <article className="home">
     |   ^
  14 |     <Header title="Home" className="header-dark" />
  15 |     <List columns={2} items={twoColListItems} />
  16 |   </article>

 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server index pages/Home

ERROR in ./client/index.js
Module build failed: SyntaxError: Unexpected token (8:2)

   6 | 
   7 | render(
>  8 |   <Root />,
     |   ^
   9 |   document.getElementById('root')
  10 | );
  11 | 

 @ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server index pages/Home
Child html-webpack-plugin for "index.html":
         Asset    Size  Chunks  Chunk Names
    index.html  568 kB       0  
    chunk    {0} index.html 541 kB [entry] [rendered]
     [../node_modules/html-webpack-plugin/lib/loader.js!./index.ejs] ./~/html-webpack-plugin/lib/loader.js!./client/index.ejs 675 bytes {0} [built]
     [../node_modules/lodash/lodash.js] ./~/lodash/lodash.js 540 kB {0} [built]
     [../node_modules/webpack/buildin/global.js] (webpack)/buildin/global.js 509 bytes {0} [built]
     [../node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 517 bytes {0} [built]
webpack: Failed to compile.

`

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with webpack.config.js and the failing entry points client/pages/Home/index.js and client/index.js, then run npm start to reproduce the parser errors. Done means the JSX in both files compiles successfully and webpack reports a successful build.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react, webpack
Domain
build-system, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.