Preact-cli: Build fails when uglifying material component script

Created on 23 Dec 2017  ·  19Comments  ·  Source: preactjs/preact-cli


Do you want to request a feature or report a bug?

Bug?

What is the current behavior?

yarn start works without error. yarn build and yarn serve fail with this same error.

If the current behavior is a bug, please provide the steps to reproduce.

It doesn't happen with out of the box configurations, but since it's dealing with a material design component, it feels like it could be related to the project:

on yarn build:

yarn run v1.3.2
$ preact build
Build [==                  ] 10% (0.1s) building modules(node:46019) DeprecationWarning: Chunk.modules is deprecated. Use Chunk.getNumberOfModules/mapModules/forEachModule/containsModule instead.
✖ ERROR bundle.09240.js from UglifyJs
Unexpected token: name (MDCFoundation) [../node_modules/@material/base/foundation.js:21,6][bundle.09240.js:926,4]
Build failed!
error Command failed with exit code 1.

Please mention other relevant information.

  • node version - 8.4.0
  • yarn version - 1.3.2
  • Operating system - OSX Sierrra.

Most helpful comment

I got a similar error:

✖ ERROR route-home.chunk.3d3d6.js from UglifyJs Unexpected token: name (Card) [../node_modules/preact-material-components/Card/index.js:8,6][route-home.chunk.3d3d6.js:38,4] ✖ ERROR route-profile.chunk.75226.js from UglifyJs Unexpected token: name (Profile) [./routes/profile/index.js:6,21][route-profile.chunk.75226.js:37,4] ✖ ERROR bundle.cc43e.js from UglifyJs Unexpected token: operator (>) [../node_modules/preact-material-components/themeUtils/generateThemeClass.js:1,15][bundle.cc43e.js:166,61] Build failed! null

preact watch doesn´t throw any errors, but preact build does

  • node version: 9.7.1
  • yarn version: 1.3.2
  • OS: OSX Sierra

All 19 comments

I got a similar error:

✖ ERROR route-home.chunk.3d3d6.js from UglifyJs Unexpected token: name (Card) [../node_modules/preact-material-components/Card/index.js:8,6][route-home.chunk.3d3d6.js:38,4] ✖ ERROR route-profile.chunk.75226.js from UglifyJs Unexpected token: name (Profile) [./routes/profile/index.js:6,21][route-profile.chunk.75226.js:37,4] ✖ ERROR bundle.cc43e.js from UglifyJs Unexpected token: operator (>) [../node_modules/preact-material-components/themeUtils/generateThemeClass.js:1,15][bundle.cc43e.js:166,61] Build failed! null

preact watch doesn´t throw any errors, but preact build does

  • node version: 9.7.1
  • yarn version: 1.3.2
  • OS: OSX Sierra

@sydev The unexpected token: name (...) seems to go away to giving them the .jsx extension on default configurations. however, im yet to resolve the operator >
Might be that the template for preact-cli "material" is wrongly configured for build?

Investigating further, it seems that it skips to transpile alot of common ES6+ operators. like string templates, arrow operator, let keyword and a few more.
Either the CLI somehow skips to run Babel on the file before sending it to build. Or if it depended on Uglify to do some conversions. Something just aint quite right here.

using preact-cli 2.2.1 with a freshly created project with preact create test --template material

looking into it

operator > is a bug on preact-material-components side, publishing a patch ASAP. upgrade to 1.3.9

Edit: I did checked with the latest build and everything latest(pmc 1.3.8), seems to be working fine for me.

Same issue in my setup as well. Cannot play around the webpack config as there is no eject command in the cli.
Unexpected token errors keep coming up in various parts of the codebase. How to circumvent this error? Running with --no-prerender doesn't work too.

☝️ should fix this

ERROR route-home.chunk.df78c.js from UglifyJs Unexpected token: name (ContentTypes) [../node_modules/msexcel-builder/lib/msexcel-builder.js:43,0][route-home.chunk.df78c.js:19724,23]

This is the error I get. And the code where it fails is just this

ContentTypes = class ContentTypes {

@vijaybritto that is something that will not be fixed with it 😆
looks like it comes from msexcel-builder

It does not happen in dev build and the same file is being loaded there as well. This has something to do with the uglifyJs config in the prod build.

Also there is no syntax error in this file. There is nothing to fix in that file I suppose? It works in other applications of mine.

yeah, may be pmc is being used inside this or something. let me just publish the update in a day or two.

in case its not super blocking!

btw if it is super urgent, just use

import {Button,....} from 'preact-material-components'

till then, its a full es5 export

I'm not using pmc anywhere in my app. I'm taking out the webpack config into the project root folder and attempting to play with it!

are you using material template of preact-cli or some other one?

preact-cli's 'default' template

I fixed it by temporarily commenting out exclude: '/node_modules/', under babel loader config in the webpack-base-config.js file

to others please upgrade to pmc 1.4.1 in your package.json

@vijaybritto that is from a package which you are using as a dependency.

@reznord I guess i can do the same in .babelrc right?

Was this page helpful?
0 / 5 - 0 ratings