Did vue and iview, use babel-polyfill, or did they report an error? here's the code.

main.js entry file

import App from "./App";
import router from "./router";
import Vuex from "vuex";
import store from "@/store";
import "iview/dist/styles/iview.css";
import "./assets/my-theme/index.less";
import "@/assets/common.css";
import { Switch, Message } from "iview";
import vueI18n from "vue-i18n";
import lang from "./i18n/index";
import infiniteScroll from "vue-infinite-scroll";
import "babel-polyfill";
import DefauleImg from "@/assets/images/lesson_default.png";
Vue.use(infiniteScroll);

Vue.use(vueI18n);

// import MsgModal from "@/components/common/MsgModal";
Vue.config.productionTip = false;
Vue.component("i-switch", Switch);
Vue.prototype.$Message = Message;
Vue.prototype.$Local = window.localStorage;

Vue.prototype._imageError = function(){
  e.target.src = DefauleImg;
};
Vue.filter("formatclass", function(value) {
  switch (value) {
    case 1:
      return "11";
      break;
    case 2:
      return "";
      break;
    case 3:
      return "";
      break;
    default:
      return "";
  }
});
// Vue.component("msg-modal",MsgModal);
if (
  localStorage.getItem("userinfo") == null ||
  localStorage.getItem("userinfo") == "" ||
  localStorage.getItem("key") == null ||
  localStorage.getItem("key") == ""
) {
  localStorage.removeItem("userinfo");
  localStorage.removeItem("key");
  //ie
  if (window["context"] == undefined) {
    if (!window.location.origin) {
      location.origin = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ":" + window.location.port : "");
    }
    window["context"] = location.origin + "/V6.0";
  }
  window.location.href = location.origin + "/admin/login/login.html";
}

const i18n = new vueI18n({
  locale: "en",
  messages: lang
});

/* eslint-disable no-new */
new Vue({
  el: "-sharpapp",
  i18n,
  router,
  store,
  components: { App },
  template: "<App />"
});

webpack
 entry: {
    app: ["babel-polyfill", "./src/main.js"]
  },

.babelrc
{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
      }
    }],
    "stage-2"
  ],
  "plugins": ["transform-vue-jsx", "transform-runtime"]
}

clipboard.png

clipboard.png

clipboard.png

Apr.07,2021

clipboard.png

at present, in order to solve the iview babel problem after demand loading, we can only define the babel file path manually

  

babel-polyfill is usually put on top.. Because maybe the plug-ins you use or the API, of some frameworks with new features are placed at the beginning to ensure that you polyfill first

Menu