react-rails icon indicating copy to clipboard operation
react-rails copied to clipboard

"Unexpected token: keyword (const)" during precompilation with uglifier

Open tf opened this issue 2 years ago • 3 comments

Steps to reproduce

Starting with 2.6.2, I started seeing errors of the form

Uglifier::Error: Unexpected token: keyword (const). To use ES6 syntax, harmony mode must be enabled w
ith Uglifier.new(:harmony => true).                                                                 
--
 228 /* 4 */
 229 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 230 
 231 "use strict";
 232 Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
 233 /* harmony export (immutable) */ __webpack_exports__["supportsHydration"] = supportsHydration;
 234 /* harmony export (immutable) */ __webpack_exports__["reactHydrate"] = reactHydrate;
 235 /* harmony export (immutable) */ __webpack_exports__["createReactRootLike"] = createReactRootLik
e;                                                                                                  
  => const ReactDOM = __webpack_require__(1)
 237 
 238 function supportsHydration() {
 239   return typeof ReactDOM.hydrate === "function" || typeof ReactDOM.hydrateRoot === "function"
 240 }
 241 
 242 function reactHydrate(node, component) {
 243   if (typeof ReactDOM.hydrateRoot === "function") {
 244     return ReactDOM.hydrateRoot(node, component)

during asset precompilation. I assume that this is due to the const keywords that have been added recently (e.g. https://github.com/reactjs/react-rails/commit/828ee368b4871be7c7d4a280ffedb541bf2afe4e#diff-1ad0e47511fb4cd2e8beb02143c504104ed6ca9cf45bde9e7456dc049280c86eR212).

System configuration

Uglifier: 4.2.0 Sprockets version: 3.7.2 React-Rails version: 2.6.2 React_UJS version: 2.6.2 Rails version: 5.2 Ruby version: 2.6

tf avatar Apr 19 '22 14:04 tf

I am seeing the same error? Any work around this?

florgb02 avatar May 18 '22 00:05 florgb02

I am also experiencing a similar issue. For me, the same error happens when analyzing the output with es-check

genarorg avatar Jun 17 '22 02:06 genarorg

Switching from Uglifier with harmony mode to Terser (a drop-in replacement, see: https://github.com/ahorek/terser-ruby) appears to "solve" the Uglifier incompatibility introduced in v2.6.2.

This was actually a suggestion from Uglifier's readme because Uglifier is for ES5 and Terser is for ES6+.

Narnach avatar Jun 28 '22 11:06 Narnach

As per @Narnach comment, we can close the issue. cc: @justin808

Switching from Uglifier with harmony mode to Terser (a drop-in replacement, see: https://github.com/ahorek/terser-ruby) appears to "solve" the Uglifier incompatibility introduced in v2.6.2.

This was actually a suggestion from Uglifier's readme because Uglifier is for ES5 and Terser is for ES6+.

alkesh26 avatar Oct 07 '22 11:10 alkesh26