Creating pre-built ES6 npm modules using webpack in a production configuration with uglifyjs

During the production process, I implement a webpack configuration with the UglifyJsPlugin. However, I have encountered an issue related to npm modules that contain es6 syntaxes when deploying to production:

An ERROR in the bundle.js file from UglifyJs states: Unexpected token name "i", expected punctuation ";" [./~/joi/lib/index.js:167,0]

This error occurs because the joi module utilizes es6 syntax (such as "for (let i in etc..)"), which Uglify cannot handle. To resolve this issue, I began precompiling specific modules that use es6 using the babel-cli utility:

babel src lib

I then replaced the old folder with the newly precompiled modules. However, this solution seems impractical. Is there a way for me to manage an array of node modules (only specified ones, not all) within the webpack configuration? Thank you for your assistance!

Answer №1

While the harmony branch of uglifyjs does have some support, it is still in development and not yet suitable for production use. UglifyJS v2.0...2.6.2 only offers support for pre-harmony/pre-es6 code at this time.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Using Typescript to assign a new class instance to an object property

Recently, I crafted a Class that defines the properties of an element: export class ElementProperties { constructor( public value: string, public adminConsentRequired: boolean, public displayString?: string, public desc ...

Various methods for deactivating controls in a CSS class

Is there a way to disable all buttons within a specific class? I have attempted the following code without success: $("input.myClass").attr('disabled', true); This is how I am trying to implement it: <script type="text/javascript> ...

Is it possible to create dynamic animations with SVG files?

I am currently in the process of coding my website, and I came up with an exciting idea to animate my navigation bar within an SVG container. With its naturally wavy design, I aim to achieve a sweeping wave effect similar to the intro animation on Discord. ...

What are the steps to eliminate the package-lock.json warning while constructing a Node application image using Docker?

Exploring Docker to develop a compact Node.js application image, I aim to eliminate the warning provided below: npm notice created a lockfile as package-lock.json. You should commit this file. npm WARN <a href="/cdn-cgi/l/email-protection" class="__cf_ ...

Adjusting data points on a radar chart.js through user interaction

I have a radar map generated using chart.js, along with some input fields where users can enter values that I want to reflect in the graph. I am exploring ways to update the chart dynamically as the user types in the values. One option is to have the char ...

Extract data from axios and display it in a Vue template

Having trouble displaying a value inside a div tag in my nuxt app. An error message keeps popping up saying "Cannot read property 'free_funds' of undefined. Still getting the hang of Axios and Nuxt. Could it be that Bootstrap requires JQuery to ...

Error encountered in NextJS middleware: NetworkError occurred while trying to retrieve resource

I'm currently working with a middleware setup in NextJS based on an old tutorial. The code provided in the tutorial seems to be functioning correctly, but when I implement the same code, I encounter a NetworkError. Upon further investigation, it appea ...

Effective ways to transmit a variable array from an HTML document to a PHP server

Is there a better method for transferring a variable array from HTML to PHP? I attempted to use the serialize function, but it doesn't seem to be functioning correctly. Any suggestions would be greatly appreciated. //HTML var arrayTextAreasNames = [ ...

Integrating Excel into a webpage - is it possible?

Currently facing an issue on my website. I'm trying to open a 'file://' URL directly with the <a href=""> element in a browser, but it's prohibited. I'm searching for a plugin or similar solution that can enable me to execut ...

Ways to merge values across multiple arrays

There is a method to retrieve all unique properties from an array, demonstrated by the following code: var people = [{ "name": "John", "age": 30 }, { "name": "Anna", "job": true }, { "name": "Peter", "age": 35 }]; var result = []; people. ...

Creating, editing, and deleting data in Ng2 smart table is a seamless process that can greatly enhance

While working on my Angular 2 project, I utilized [ng2 smart table]. My goal was to send an API request using the http.post() method. However, upon clicking the button to confirm the data, I encountered the following error in the console: ERROR TypeErro ...

What is the best way to extract data from a JSON object in JavaScript?

let result = JSON.parse(data.d); The current code doesn't seem to be working.. Here is the structure of my JSON object: [{"ItemId":1,"ItemName":"Sizzler"},{"ItemId":2,"ItemName":"Starter"},{"ItemId":3,"ItemName":"Salad"}] Any suggestions on how I ...

Is RaphaelJS truly a vector-based tool?

Is it possible to position a circle at 50% of the width of the canvas using RaphaelJS without having to calculate the exact pixel value? I am looking for a simple way to place an element at half its container's width, but I'm not sure if this can ...

Error: Validation issues detected in field functionality

My goal is to loop through a set of text fields and check if the user has input any values. However, I'm facing an issue where even though I have provided values in the text fields, it seems like they are empty. To better illustrate my problem, I have ...

While using the ionic serve command

Every time I attempt to execute Ionic, an error is triggered. Your assistance is greatly appreciated. Interestingly, the AppData file has been erased as well! 'ionic' is giving me this message: "not recognized as an internal or external command ...

Facing a problem with npx getting stuck while initializing a new React, Expo, or Next.js application

I have encountered an issue where certain commands hang indefinitely when trying to initiate a project: npx create-react-app npx create-expo-app npx create-next-app For example: C:\Users\james\Documents>npx create-expo-app@latest my-app ...

Vue alert: The element <testimonial-photo-inner> cannot be located

After adding VueJS to my website, I am encountering numerous console errors similar to the one above. Although I have not yet attempted to create any Vue components, there are several custom HTML tags present on my site. Does VueJS automatically interpret ...

Running the `npm run coverage` command results in an error message stating: "Function 'require(...).internalModuleStat' is not

We're encountering a strange issue while running our tests. When we use the command npm run test, everything seems to be passing without any problems. However, when we switch to npm run coverage, some of the tests fail with the following error message ...

Inquiring about the intricacies of using Regular Expressions in

Can anyone provide a regex that only allows the characters 0-9, a-z, A-Z, hyphen, question mark, and "/" slash, with a character length between 5 to 15? I attempted the following approach, but it did not yield the desired result: var reg3 = /^([a-zA-Z0-9? ...

Differences between ts-loader and babel-loader when working with TypeScript in webpack

Recently, I set out to compare the compiled output code between these two configurations. ts-loader { test: /\.tsx?$/, use: 'ts-loader', } babel-loader use: { loader: 'babel-loader', options: { p ...