Vue and UglifyJS error when running 'npm run build'

Question

When I run 'npm run build' I get the following error

ERROR in build.js from UglifyJs Unexpected token: punc (() [build.js:11307,24]

The code that seems to be causing the issue is somewhere in the below code.

Note: When I remove methods: {} and created(){} the error is resolved. I have also tried removing one function at a time from these two code blocks and nothing works until I completely remove both full sets of code blocks.

I can empty the "methods" code block and completely remove the "created" code block and it builds fine as well.

Also I do not have any issue running 'npm run dev'.

export default {
    data: function() {
        return {
            currentSlide: 1,
            slides: [
                'slideshow-slide-1.png',
                'slideshow-slide-2.png',
                'slideshow-slide-3.png'
            ],
            slideInfo: [
                { title: 'Commercial Truck Parts Wholesaler', description: 'All makes trucks parts, components and acillary products' },
                { title: 'Quality and Name-Brand Products', description: 'Direct ship program with mix and match capabilities' },
                { title: 'Fleet, Part Distributor or Service Facility?', description: 'Contact us to improve your parts procurement processa and reduce your inventory' }
            ],
            myTimer: 0
        }
    },
    methods: {
        autoRotateImages() {
            this.myTimer = setInterval(function() {
                if (this.currentSlide < 3) {
                    this.currentSlide += 1;
                } else {
                    this.currentSlide = 1;
                }
            }.bind(this), 5000);
        },
        changeSlide(index) {
            this.currentSlide = index;
            clearInterval(this.myTimer);
            this.autoRotateImages();
        },
        getImageUrl(slide) {
            return '/dist/'+slide;
        }
    },
    created() {
        this.autoRotateImages();
    }
}

EDIT: Using this in my webpack.config.js file

test: /\.js$/,
loader: 'babel-loader',
exclude: /node_modules/,
query: {
    presets: ['es2015']
}

Possible duplicate of [Uglify SyntaxError: Unexpected token: punc ())](https://stackoverflow.com/questions/42375468/uglify-syntaxerror-unexpected-token-punc) — thanksd, Oct 13 '17 at 13:33
Thanks you, @thanksd for pointing out that this is a duplicate of https://stackoverflow.com/questions/42375468/uglify-syntaxerror-unexpected-token-punc — bnjmn.myers, Oct 13 '17 at 14:01

score 0 · Answer 1 · answered Oct 13 '17 at 13:31

0

I think this

created() {
    this.autoRotateImages();
}

should be

created: function() {
    this.autoRotateImages();
}.bind(this)

Are you transpiling your production code?

answered Oct 13 '17 at 13:31

Tobias Timm

1,855
15
27

This did not work unfortunately. See my edit above for transpiler code. – bnjmn.myers Oct 13 '17 at 13:52

score 0 · Answer 2 · answered May 01 '18 at 13:19

0

Try

npm cache clear -f

And than

npm install

May be it will solve issue

answered May 01 '18 at 13:19

Sumit Patel

82
4

Vue and UglifyJS error when running 'npm run build'

2 Answers2