I've created an Angular app which works fine on locally.
However when I try to build (grunt build) to generate the dist folder that will contain my app with everything minified and ready to deploy, I have a error at the Uglify step.
Error:
JS_Parse_Error {
message: 'Unexpected token operator «=», expected punc «,»',
filename: '../../.tmp/concat/scripts/scripts.js',
...
I've read that people had similar errors, just the operator was a different one in the error message.
If someone has a clue.
My issue came from the function's parameters with a default value.
For example:
function (a = myValue, b) {
...
For some reason, giving that default value was not supported.
I replaced it by doing something like:
function (a, b) {
a = typeof a !== 'undefined' ? a : myValue;
...
You will find explanations of that behaviour by googling (uglify, ES6), I'm just offering the solution of my specific error.
Related
Recently we have upgraded the react-native-web package to latest version 0.17.0 From that time we are getting the issue TypeError: Cannot read property 'twoArgumentPooler' of undefined while running yarn test
To analyse this issue, gone through the code which is implemented by our developers but we didn't have anything like twoArgumentPooler but it's available in react-native-web package in the path
at Object.<anonymous> (node_modules/react-native-web/dist/cjs/exports/Touchable/BoundingDimensions.js:19:46)
How to resolve this issue
Can you show your jest config file? I had a similar issue and it turned out that I was (manually) setting up the moduleNameMapper incorrectly. I had the following:
moduleNameMapper: {
'react-native': 'react-native-web',
},
which, upon running the tests, effectively invalidated an import on line 10 inside react-native-web/dist/exports/Touchable/BoundingDimensions.js (the file mentioned in your stacktrace) and surely a lot of other imports.
This
import PooledClass from '../../vendor/react-native/PooledClass';
var twoArgumentPooler = PooledClass.twoArgumentPooler;
turned into this (notice the changed and incorrect path)
import PooledClass from '../../vendor/react-native-web/PooledClass';
var twoArgumentPooler = PooledClass.twoArgumentPooler;
This ultimately resulted in the exact same error as you got, and was resolved by correctly defining the remapper entry like this:
moduleNameMapper: {
'^react-native$': 'react-native-web',
},
Hope it helps! If nothing else, perhaps this will help someone in the future!
1. Problem
I am running npm start which is building my react-firebase application, which compiles fine but when I look at my app on localhost I receive this error:
Build Stack Trace
2. What I've Done
I tried to follow suggestions in this Github post.
I noticed that by going to node_modules/#firebase/firestore/dist/index.cjs.js:27457:21 and changing firebase.INTERNAL.registerComponent to firebase.INTERNAL.registerComponent this changed the error to TypeError: instance.registerVersion is not a function which makes me believe that there must be some issue with my version of firebase.
I have tried to revert firebase to version 7.6.0 since there was a recent update made on 01/09/2020 to no avail.
I tried doing all the installing of dependencies in a virtual environment just in case, for some reason, there were some discrepancies between projects
First Error Location:
function configureForFirebase(firebase) {
firebase.INTERNAL.registerComponent(new component.Component('firestore', function (container) {
var app = container.getProvider('app').getImmediate();
return new Firestore(app, container.getProvider('auth-internal'));
}, "PUBLIC" /* PUBLIC */).setServiceProps(shallowCopy(firestoreNamespace)));
}
Second Error location:
function registerFirestore(instance) {
configureForFirebase(instance);
instance.registerVersion(name, version);
}
I followed this tutorial to install the Wiris plugin on a new installation of Drupal.
Once the installation was complete and I clicked on the Wiris icon to begin adding a formula, the popup window does NOT load and I get the following error in the console area:
Uncaught DOMException: Failed to execute 'postMessage' on 'Window': Invalid target origin '/DrupalQuiz/sites/all/libraries/ckeditor/plugins/ckeditor_wiris/' in a call to 'postMessage'.
at http://*.*.*.*/DrupalQuiz/sites/all/libraries/ckeditor/plugins/ckeditor_wiris/core/core.js:19:22
The code causing the problem is as follows:
e.source.postMessage(postVariable, _wrs_conf_path);
I'm at a loss how to deal with this issue.
I don't have a complete fix but I was able to get it working locally by replacing _wrs_conf_path with the base path of my dev box. _wrs_conf_path was evaluating to a relative path to the plugins folder.
if (typeof(e.source) != 'undefined') {
e.source.postMessage(postVariable, _wrs_conf_path);
}
with
if (typeof(e.source) != 'undefined') {
e.source.postMessage(postVariable, _wrs_currentPath);
}
in the /sites/all/libraries/ckeditor/plugins/ckeditor_wiris/core/core.js file.
Edit: I replaced _wrs_conf_path with one of their internal variables _wrs_currentPath and that seemed to fix the issue.
I'm trying to take React 0.14 for a spin before I upgrade it in my project. However, with a simple "hello world" prototype, Webpack is throwing an error:
ERROR in ./~/react/lib/ReactElement.js
Module parse failed: /home/dan/Demos/reactiflux/node_modules/babel-loader/index.js!/home/dan/Demos/reactiflux/node_modules/react/lib/ReactElement.js Line 25: Unexpected string
You may need an appropriate loader to handle this file type.
| // The Symbol used to tag the ReactElement type. If there is no native Symbol
| // nor polyfill, then a plain number is used for performance.
| var REACT_ELEMENT_TYPE = typeof _Symbol === 'function' && _Symbol.'for' && _Symbol.'for'('react.element') || 0xeac7;
|
| var RESERVED_PROPS = {
# ./~/react/lib/ReactMount.js 18:19-44
I do have babel-loader configured, and when I downgrade to React 0.13, everything works. What really stands out to me, is _Symbol.'for', in the middle of the error message.
In react/lib/ReactElement.js on line 21 (not 25), that line looks much more correct, with square brackets around the 'for' key:
var REACT_ELEMENT_TYPE = typeof Symbol === 'function' && Symbol['for'] && Symbol['for']('react.element') || 0xeac7;
I assume that the code shown in the error message is either in an intermediate state during compilation, or is the final compiled output. Does anyone know what could cause Webpack to produce something that looks so wrong? Has anyone successfully used Webpack, Babel and React ~0.14.1 together yet?
update
There is an issue for this: https://github.com/babel/babel/issues/2377
It's closed, but it looks like it came back for me. This was fixed in 5.8.25, but I have 5.8.29 and I still hit the bug.
It appears that the problem has something to do with me including babel runtime. My .babelrc was copied from an older project:
{
"optional": "runtime",
"stage": 0
}
In this little hello-world demo, there is nothing that requires bundling the runtime, so I just removed it, after noticing that https://github.com/DominicTobias/universal-react/, which also uses the same build tools, does not need it. That was the only change I needed to make to get this to build.
My webpack config is super simple:
var path = require("path");
module.exports = {
entry: "./index.js",
output: {
path: path.join(__dirname, "/dist"),
filename: "index.min.js"
},
module: {
loaders: [{
test: /\.js$/,
loader: "babel"
}]
}
};
I guess that's what I get for copying a config file from a more complex project into what was supposed to be a simplest possible demo.
I see that there is a babel-plugin-runtime as well as a babel-runtime on NPM, but when I tried out BPR for the sake of completeness, Babel complains: Module build failed: ReferenceError: The plugin "runtime" collides with another of the same name. Since I don't actually need the runtime, the linked GH repo is a 404, and since this really belongs in the issue trackers after all, this is as far as I am going to take this for now.
No, that is not valid code. That was an issue in Babel project, but it has been fixed in the 6.0 version which was released recently.
I was run into this issue too, and now I have checked this with latest version, and it is works fine. Here is my test steps:
# install Babel and plugins
npm install babel-cli babel-preset-es2015 babel-plugin-transform-runtime
# install React
npm install react
# run babel against problem react file
./node_modules/.bin/babel node_modules/react/lib/ReactElement.js --plugins transform-runtime --presets es2015
It is provides valid output, so the issue seems to be resolved.
And there is good news for you, babel-loader for webpack already supports 6 version of Babel. Check out its docs for details
i'm pretty new to gulp , and I follow tutorials in http://leveluptuts.com/tutorials/learning-gulp , I get this error:
events.js:141
throw er; // Unhandled 'error' event
^
Error
at new JS_Parse_Error (/home/kid/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:196:18)
at js_error (/home/kid/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:204:11)
at croak (/home/kid/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:680:9)
at token_error (/home/kid/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:688:9)
at unexpected (/home/kid/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:694:9)
at expr_atom (/home/kid/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:1201:9)
at maybe_unary (/home/kid/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:1363:19)
at expr_ops (/home/kid/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:1398:24)
at maybe_conditional (/home/kid/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:1403:20)
at maybe_assign (/home/kid/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:1427:20)
here is my code :
var gulp = require('gulp')
uglify = require('gulp-uglify');
gulp.task('default', function() {
// body...
gulp.src('js/*.js')
.pipe(uglify())
.pipe(gulp.dest('minjs'));
});
and the tree of directory, just simple
-gulp
-js/
-gulpfile.js
thanks a lot
Your uglify task is probably choking on one of the files it is trying to process. Handle the error and write the output to the console so you can see which file causing the task to fail.
gulp.task('scripts', ['clean'], function () {
return gulp.src('js/*.js')
.pipe(uglify().on('error', function(e){
console.log(e);
}))
.pipe(gulp.dest('minjs'));
});
When you run your gulp task again, you will still get an error, but this time, right towards the top of the output, you will see the file and line number that uglify is having trouble processing. Debug from there.
Maybe its a syntax error? Fix it and try again.
Maybe you've got a weird _reference.js file with unexpected characters like those you see in Visual Studio projects sometimes? Exclude it from the gulp.src and try again.
I had the same error. So I tried to output an error to the console (thanks to bingo). I realized that the problem is that gulp-uglify doesn't want to work with ES6. I changed my JS code to ES2015 and voila. You can also use gulp-babel.
In my case, it seems it doesn't accept "arrow-syntax" function
(e.g. data=>{ // do something; })
Also you can use gulp-util.
https://www.npmjs.com/package/gulp-util
var gutil = require('gulp-util');
gulp.task('scripts', ['clean'], function () {
return gulp.src('js/*.js')
.pipe(uglify().on('error',gutil.log))
.pipe(gulp.dest('minjs'));
});
I had the same issue and was getting the same error.
The problem was, one of my JS files had #charset "UTF-8"; in the first line. So the syntax was breaking due to # symbol. I removed it and it worked well.
{
SyntaxError: Unexpected character '#' at JS_Parse_Error.get
(eval at <anonymous> (C:\xampp\htdocs\catch\node_moles\uglify-js\tools\node.js:21:1),
<anonymous>:86:23) at formatError (util.js:649:15)
at formatValue (util.js:554:18)
at formatProperty (util.js:795:15)
at util.js:655:12
at Array.map (native)
at formatObject (util.js:654:15)
at formatValue (util.js:593:16)
at inspect (util.js:186:10)
at exports.format (util.js:72:24)
message: 'Unexpected character \'#\'',
filename: 'all.min.css', line: 1, col: 0, pos: 0 },
plugin: 'gulp-uglify',
....
....
}
I had the same issue and it came down to a js file that was giving out issues. The biggest issue was I had 10 js files but after a little digging my issue was not adding ;
since this will minify your code it does not matter you use ES6 you need to add ; at the end of your code or minifying won't work.
use gulp-uglify-es instead gulp-uglify. It works with es6