-
Notifications
You must be signed in to change notification settings - Fork 122
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
webpack -p outputs: ERROR in bundle.js from UglifyJs Unexpected token: name (login) [./login.es6:2,4] #3
Comments
@joeeames I am having the same issue here. I getting ERROR in bundle.js from UglifyJs |
I'll try to take a look at it over the holiday. There was a major release for Babel so that's probably it. |
@joeeames thanks so much and have a Happy Thanksgiving. |
Hey, you too! May the pie be never-ending! |
Holiday is over Joe. Hope it was great! Now back to the error. I'm getting it also. Will back off to the versions you specified in the course. Cold Hearted Learner. Thanks, Jerry |
Backed of babel-core to 5.4.7, babel-loader to 5.1.3 and for safety webpack to 1.12.9 and all worked well. Great course Joe. Moving forward. Jerry |
ok, the readme file for this repo has the directions to work correctly around this issue while using the latest version of Babel. Please look at that, let me know if you have any issues. Also, an update has been submitted to the course videos, although it can take as long as a month to get published. |
+1 UglifyJs in webpack not working with babel >= 6.0.0 |
I followed the directions in this repo for Babel 6, but also getting the unexpected token error when running production build. It only happens in the "Organizing Files and Folders" course section, when the javascript files get moved into a js folder. In the previous section when all the js files are in the root directory, the production build runs fine. Is there any other webpack config required to tell it that the js files are now in a "js" directory? From the error message, looks like Uglify is trying to process the .es6 file, but should it first be transpiled to js by babel? Running: webpack --config webpack-production.config.js -p And error:
|
Update: I noticed that as of the "Organizing Files and Folders" course section, even running the dev build, the es6 files were no longer being transpiled. Updated the loader section slightly to specify "babel" instead of "babel-loader" and added a "query" section for presets. Now both dev and prod builds work: loaders: [
{
test: /\.es6$/,
exclude: /node_modules/,
loader: 'babel',
query: {
presets: ['es2015']
}
}
] |
I've ran into a similar problem, but, I'm not using Babel (unless I left a switch set somewhere in some pasted code, but I've checked). Instead, I am posting to a platform that allows ES6 natively via Node 4.3. Any advice on what I could do to correct this?
Here' line #10 .. let str = ""; |
Just an update to those following this thread, I will be working through this to see what needs to change in the course, and apologies for the delays, the process takes a long time. |
@joeeames I'm currently working through the tutorial; I can mark down any issues I come across and forward them on to you if it would help? |
That would be excellent @hopcycle! |
Same issue here. |
@danielabar @joeeames When I ran into this, adding just the query option as per danielabar's comment fixed things for me:
|
Thanks @danielabar.
|
Still not working for me , done the above points |
+1 for @danielabar's solution. |
I was with same problem, but I'm using typescript with es6 and ts-loader.
And changed loader like this:
Courtesy from http://www.jbrantly.com/es6-modules-with-typescript-and-webpack/ Hope that help someone with same problem! |
I have the same error in webpack 2 with typescript 2 |
Same here: webpack 2, typescript 2 |
For typescript, I recommend using rules: [
{
test: /\.ts$/,
loaders: [
'babel-loader?presets[]=es2015',
'awesome-typescript-loader',
// For angular2:
//'angular2-template-loader',
//`angular2-router-loader?genDir=compiled/app&aot=true`
],
exclude: [/\.(spec|e2e|d)\.ts$/]
}
] and tsconfig: {
"compilerOptions": {
"target": "es6",
"module": "es2015",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"noEmitHelpers": true,
"skipDefaultLibCheck": true,
"strictNullChecks": false,
"outDir": "tmp"
},
"exclude": [
"node_modules"
],
"awesomeTypescriptLoaderOptions": {
"useBabel": true,
"useCache": true
}
} |
webpack#2 users, I can also suggest an alternative solution who wants to stick to ES6 (by implication to prevent to transpile code on every build, and ofc prevent loading ES6 polyfills).below are detailed instructions to use the Harmony branch of UglifyJs2 with webpack:
to point UglifyJs2 (harmony branch) dependency to that branch.
OR,
|
@fulls1z3 That doesn't seem to fix it for me. const parseSVG = function parseSVG(svg, width, height) {
let div = document.createElementNS('http://www.w3.org/1999/xhtml', 'div')
div.innerHTML = '<svg width="'+width+'" height="'+height+'">'+svg+'</svg>'
return div.firstChild;
} Specifically: Gives me the following output
When I run |
+1 seeing this issue. using webpack 2, babel 6
relevant webpack config:
|
If you use babel-preset-env : |
I am new entry in the club. The only solution that worked for me was the one posted by @alexey-sh. But what is going on here? In my case I encountered the issue after installing a vue component. So who is at fault exactly? Babel, webpack, uglifyJS? |
配置要写在rules里面啊啊啊啊。。。
|
Just bumped to that issue because I was actually using $ npm i -D uglifyjs-webpack-plugin And updated my import UglifyJS from "uglifyjs-webpack-plugin";
// ...
if (process.env.NODE_ENV === "production")
config.plugins = [new UglifyJS({/* ... */})]; |
@aminnairi 's solution worked for me, const UglifyJS = require('uglifyjs-webpack-plugin'); |
Note: in case someone stumbles upon this issue, after searching for a solution, I add my current working solution notes here. After reading through this issue and another one in the webpack repository, I got the following two alternative working solutions. I first installed these packages (Note: babel-preset-es2015 -> babel-preset-env):
Then I either modified the
or add the
(thx @xuwanwanTT for the hint) My webpack config (plugins) looks like this afterwards:
It also works if you use both together. After that |
The
- const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
+ const UglifyJsPlugin = require("uglifyes-webpack-plugin");
+ const UglifyJsPlugin = require("uglifyes-webpack-plugin");
...
plugins: [
- new webpack.optimize.UglifyJsPlugin({
+ new UglifyJsPlugin({
... |
@up9cloud Don't you think it is kinda dangerous to edit files in the |
@natterstefan umm... you're right. we should avoid to edit node_modules/ content. thanks! |
I implemented a solution by combining @aminnairi solution and other ones mentioned above.
in webpack config, import this plugin: and in webpack plugins I used this plugin instead of webpack.optimize.UglifyJsPlugin: |
do not exclude "node_modules" |
@up9cloud While that solution does look promising, I think the real problem lies with babel. In my case I have one specific file (its a large jsx file) and two very specific lines in it are not being transpiled by babel for some reason?!
Out of this cutout of code, the 'let n' does not transpile to 'var' and the '(aggr, cluster)=>{' does not transpile to 'function (aggr, '. Absolutely every thing else in this file transpiles correctly tho, before it gets to uglify. |
@up9cloud / @manojkumaran very clean solution. Thank you, this was a major headache |
@manojkumaran For some reason |
@megamindbrian You are correct it is not the same version. https://github.com/webpack-contrib/uglifyjs-webpack-plugin ℹ️ webpack =< v3.0.0 currently contains v0.4.6 of this plugin under webpack.optimize.UglifyJsPlugin as an alias. For usage of the latest version (v1.0.0), please follow the instructions below. Aliasing v1.0.0 as webpack.optimize.UglifyJsPlugin is scheduled for webpack v4.0.0 |
Got it fixed by installing |
Yes, same for me, as well as modifying the config to use the new package instead of the built in one that comes with webpack |
created a
|
Hi I am getting the error 0 info it worked if it ends with ok |
I had this error message :
I fixed the error by replacing : with :
I'm using version 1.0.1 of the uglifyJS plugin ( |
|
I was using Webpack 2.7 and was having the same error. Then I decided to upgrade it to version 3. Voila, it resolved my issue. |
Can somebody tell me where to create webpack.config.js? I don't have any in the root directory but there are a lot in other folders in node modules. I tried all the suggestions but still, the problem exists. |
Thanks, Kmoec |
I am getting an error when trying to use
webpack -p
. When I change the code to ES5 compatible code it seems to work. Something with the UglifyJS minification and ES6 apparently.This is my
login.es6
file:I have exactly the same code as the course mentions. I am using the newer versions of the tools and it seems to be a problem there. When using the versions as provided in the course, There is also no error when only changing
babel-core
andbabel-loader
to the versions provided.My version of devDependencies (with UglifyJS error):
My partially updated version of devDependencies (without UglifyJS error):
Does anyone have an idea on how to solve this minification problem while using babel >6?
Thanks!
The text was updated successfully, but these errors were encountered: