While my Vue.js components work perfectly in Edge, Chrome, Firefox, and other browsers, they fail to render in IE11. I utilize gulp for project building and Babel for compiling es6 into es5.
.babelrc
{
"plugins": ["@babel/plugin-syntax-dynamic-import"],
"presets": [
["vue", {"eventModifiers": false}],
["@babel/preset-env",{"useBuiltIns": "entry"}]]
}
Could it be that I require additional presets?
To effectively utilize the @babel/present-env preset, it is necessary to specify the browsers that the build script should cater to.
One way to achieve this is by creating a browserlist with the specific browsers or support percentages you wish to target - https://babeljs.io/docs/en/babel-preset-env#targets
If your goal is to support modern browsers along with IE11 (which typically has a usage percentage above 2%), you can implement the following configuration:
{
"browserslist": [
"> 2%"
]
}
Since IE11 does not support IE11, you will need to make changes to your
.babelrc (Babel 7)
{
"presets": [
[
"@vue/app",
{
"targets": {
"ie": "11"
}
}
]
]
}
Please let me know if this solution works for you. If you are using Babel 6, refer to Alen Genzić's response.
I am creating a unit test to verify that a method gets called when a checkbox is clicked. For this test, I am utilizing ElementUI. Below is a snippet from the component template: <template lang="pug"> el-card el-checkbox#checkAllChec ...
Using jQuery for Background Image Position: $(window).scroll(function() { var scroll = $(window).scrollTop(); if (scroll >= 50) { $(".class").addClass("bgposi"); // $(".top").addClass("fixd"); // $(".logo").addClass ...
I am currently utilizing NodeJs and MongoDb for my back-end services. Within my collection, there are various documents with fields named _id and Name. My goal is to receive the output in JSON objects structured as follows: [ { Name:"Paul" }, ...
I am attempting to eliminate all non-digit characters from a string using JavaScript. While this code works properly in FF and Chrome, it does not work in IE11 and no characters are removed. var prunedText = pastedText.replace(/[^\d\.]/g,""); ...
When errors occur within Angular, debugging becomes quite challenging for me. Here is the code snippet I am working with: <script> var my_app = angular.module("campaign_listing", ['$http']); var controllers = {}; controllers.ca ...
After receiving data from a web server, I created a JSON object using the code obj = JSON.parse(data). This object contains information about dinosaurs such as their name, group, diet, and period. This is what the JSON object looks like: [{"name":"Stauri ...
I keep encountering this issue: "TypeError: Event.$emit is not a function" every time the watcher triggers. Even though I imported the Event object in my main.js file and can log it to the console, I am using a named prop due to having three different cli ...
Whenever I run my app, I encounter the following error: WARNING Compiled with 1 warnings ...
The Enigma of JS Dates My Initial Expectations In my Node applications, I have implemented functionality to send broadcasts to platforms like Facebook Messenger. Users subscribe to receive these broadcasts at a specific time, for example, 2pm daily. Whe ...
In the scenario where JavaScript is used to make an ajax request: index.js- var dataFeedback = $("#feedback_popup_message_body").val(); var jsonObj = JSON.stringify({dataFeedback: dataFeedback}); $.ajax({ url: "index.php", type: 'POST' ...
Here is a sample JavaScript function: function f1() { alert("HI"); } I have two different locations where I am calling the same JavaScript function: <input type="submit" id="btn1" onclick="f1()"/> <input type="submit" id="btn2" onclick="f1 ...
Having faced numerous issues with SQLite, I decided to explore LokiJS as an alternative solution for my Ionic app. However, even with LokiJS, I encountered challenges. Currently, I have a simple code that should function smoothly: .controller('Proje ...
My transition from a Flask backend without a front end framework to Vue.js (with no chosen backend yet) has me considering how to structure my project. Previously, I would create a 'base.html' file that contained all the necessary HTML code, depe ...
EDIT: I don't think this question is the same as the one linked. I understand how to retrieve a private variable (as seen in the code below), but my question was about invoking a private function within the same object. I'm struggling to find re ...
I am looking to explain my objective clearly I need guidance on how to establish a remote desktop connection from my Angular.js application to a windows application running system. The server I am using is Google App Engine. My current ideas: The Windo ...
Currently running a little experiment as I dive into VueJS. My main query revolves around how to access the marker object generated through the v-for loop. <gmap-marker :key="index" v-for="(m, index) in markers" :icon="m.icon" : ...
I have successfully developed a custom plugin, as illustrated in the image. I am able to insert objects with the class "placeholder" like this: <span class="placeholder">Loop-ANS(Q2)</span>. https://i.sstatic.net/jrNX0.png This inli ...
I am looking to develop a Cart System using solely HTML5, AJAX, and Jquery without incorporating any server side scripting language like PHP or ASP.NET. The scenario I have is: "A designated HTML division displaying added products with their Name, Price, ...
Clearly, the question is quite straightforward... I have a script that is drawing graphics across the window. Currently, when I resize the window (e.g., make it full screen), the script only responds to the original size of the window. It should refresh a ...
I am working with a sorted array containing lists of string arrays: 0:['BS', 'MS','KHB', 'CCBPO'] 1:['BS', 'MS','KHB', 'HBPO'] 2:['BS', 'MS','KHB' ...