programing

Uglify 구문 오류 : 예기치 않은 토큰 : punc ())

copyandpastes 2021. 1. 14. 23:36
반응형

Uglify 구문 오류 : 예기치 않은 토큰 : punc ())


JS 파일이 포함 된 폴더를 축소하기 위해 gulp를 사용하려고합니다. 그러나 파일 중 하나에 위의 오류가있어 축소되지 않습니다.

여기에 부분적으로 인쇄 한 오류를 잡아서 인쇄 할 수있었습니다.

JS_Parse_Error {
 message: 'SyntaxError: Unexpected token: punc ())',
 filename: 'ex.js',
 line: 189,
 col: 25,
 pos: 6482,
 stack: Error\n    at new JS_Parse_Error (eval at <anonymous> ... ) 
 plugin: 'gulp-uglify',
 fileName: '.../js/ex.js',
 showStack: false
}

문제의 파일에는 다음이 포함되어 있습니다.

function() {
  ...
  $.confirm({
    buttons: {
        confirm: function() {
            $.post('/ajax-handler', {
                    ...
                })
                .done( function(response) {
                    var data = filterResponse(response);
                    if (data['status'] == 'success') {
                        sleep(1000).then(() => {
                    *       ...
                        });
                        sleep(5000).then(() => {
                            ...  
                        });

                    } else {
                        console.log('Oops!');
                    }
                })
                .fail( function(err, status, response) {
                    ...
            });
        },
        cancel: function() {}
    }
 });
  ...
}

JS_Parse_Error에 나열된 정확한 위치를 나타 내기 위해 위의 "*"를 추가했습니다.


// 업데이트

댓글에서 ~ @imolit

 v2.0.0 (2018-09-14)-주요 변경 사항 (링크)

uglify-js로 다시 전환하십시오 (uglify-es는 포기 됨, uglify ES6 코드가 필요한 경우 terser-webpack-plugin을 사용하십시오 ).


업데이트 전 원래 답변 ...

webpack과 함께 작동하는이 솔루션에서 영감을 얻을 수 있기를 바랍니다. (아래 링크)

UglifyJS ES6를 가르치기 만하면됩니다.

UglifyJS에는 ES5ES6 (Harmony) 의 두 가지 버전이 있습니다. git
ES5 버전은 기본적으로 모든 플러그인과 함께 제공되지만 Harmony 버전을 명시 적으로 설치하면 해당 플러그인이 대신 사용합니다.

package.json

"uglify-js": "git+https://github.com/mishoo/UglifyJS2.git#harmony"

또는

npm install --save uglify-js@github:mishoo/UglifyJS2#harmony

yarn add git://github.com/mishoo/UglifyJS2#harmony --dev

웹팩

webpack과 함께 사용하려면 webpack 플러그인도 설치하십시오.

npm install uglifyjs-webpack-plugin --save-dev

yarn add uglifyjs-webpack-plugin --dev

그런 다음 수동으로 설치된 플러그인을 가져옵니다.

var UglifyJSPlugin = require('uglifyjs-webpack-plugin');

코드에서 대체

-  new webpack.optimize.UglifyJsPlugin({ ... })
+  new UglifyJSPlugin({ ... })

더 많은 웹팩 정보 (설치 / 사용)는 https://github.com/webpack-contrib/uglifyjs-webpack-plugin#install을 참조 하십시오.


npm install uglifyjs-webpack-plugin --save-dev 충분하지 않다

가장 큰 문제는 "uglifyjs-webpack-plugin": "^0.4.6"웹팩의 package.json

According to semver, ^0.4.6 := >=0.4.6 <0.5.0. Because of the leading zero, webpack will never use the 1.0.0-beta.2.

So after running npm i -D uglifyjs-webpack-plugin@beta, you need to do one more step which is rm -rf node_modules/webpack/node_modules/uglifyjs-webpack-plugin. Then webpack will pick up the version from node_modules/uglifyjs-webpack-plugin instead of node_modules/webpack/node_modules/uglifyjs-webpack-plugin

Update on 2018-04-18: webpack v4 does not have this issue


Add the babel-preset-es2015 dependency to fix this.

And also add 'es2015' in .babelrc file.

json
{
    "presets": ["es2015"]
}

I am having the same issue, i found a great answers here that helped me to reach the the file that was causing the error.

Go to Rails Console and Paste:

JS_PATH = "app/assets/javascripts/**/*.js";
Dir[JS_PATH].each do |file_name|
  puts "\n#{file_name}"
  puts Uglifier.compile(File.read(file_name))
end

Hope it helps someone!


For me it had nothing to do with Uglify not working correctly, but rather a dependency (in this case empty-promise) that has not been compiled to ES5 yet. As we just imported the raw source file, but babel is only transpiling files outside of node_modules, uglify got confused by the ES6 syntax.

Simply check if any dependency you've recently added might not have a "dist" build.


If you got this error using Grunt (grunt-contrib-uglify) the solution is to install ES6 version of the plugin:

npm install grunt-contrib-uglify-es --save-dev

Add stage-3 to presets in .babelrc file.

{
  "presets": [
    "stage-3"
  ]
}

I had the same problem with you. I was using gulp.js. I solved this problem thanks to js files change ES format. For example before solved is my code:

for (district for response) {
                $('#districts').append('<option value="' + district.id + '">' + district.name + '</option>');
                $('#districts').removeAttr('disabled');
            }

after fix code:

for (district in response) {
                $('#districts').append('<option value="' + district.id + '">' + district.name + '</option>');
                $('#districts').removeAttr('disabled');
            }

In summary, the problem is due to Ecma-uglify.js.

ReferenceURL : https://stackoverflow.com/questions/42375468/uglify-syntaxerror-unexpected-token-punc

반응형