Some components will report errors or fail to display after iview packaging, but everything is fine before packaging.

iview, is used in the UI library of the project. Everything is fine before npm run build, but after packaging, there will be problems such as calling this.$Message error, Modal,Slider,Checkbox and other tools can not be displayed. What is the reason?
this is the error report of calling method:
clipboard.png

main.js:

import "babel-polyfill"
import "./assets/css/reset.styl"
import "./assets/css/theme-default.styl"
import Vue from "vue"
import Vuex from "vuex"
import App from "./App"
import {
  i18n
} from "@/locale"
import store from "@/store"
import router from "./router"
import axios from "@/apis/http/axios.js"
import commonHttp from "@/apis/http/commonHttp"
import _P from "@/assets/js/public"
import HappyScroll from "vue-happy-scroll"
import iView from "iview";
import "iview/dist/styles/iview.css";
import {Message,Spin,Page,Switch,Upload,Select,Slider,CheckboxGroup,Modal,Checkbox} from "iview";

import "vue-happy-scroll/docs/happy-scroll.css";

Vue.config.productionTip = false
Vue.use(Vuex)
Vue.use(_P)
Vue.use(HappyScroll)
Vue.use(iView)
Vue.prototype.axios = axios
Vue.prototype.commonHttp = commonHttp
Vue.prototype.$Message = Message
Vue.prototype.$Spin = Spin
Vue.prototype.$Page = Page
Vue.prototype.$Switch = Switch
Vue.prototype.$Upload = Upload
Vue.prototype.$Select = Select
Vue.prototype.$Slider = Slider
Vue.prototype.$CheckboxGroup = CheckboxGroup
Vue.prototype.$Modal = Modal
Vue.prototype.$Checkbox = Checkbox


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

vue component, I called directly without introducing a module. The direct npm run dev is displayed normally. I suspect it is a plug-in conflict and other problems. To solve the problem


remove the following code and give it a try. A personal test is fine.

//  import iView from 'iview'; 
//  Message Spin  vue  this.$Message 
import {Message,Spin,Page,Switch,Upload,Select,Slider,CheckboxGroup,Modal,Checkbox} from 'iview';

Vue.prototype.$Message = Message
Vue.prototype.$Spin = Spin
Vue.prototype.$Page = Page
Vue.prototype.$Switch = Switch
Vue.prototype.$Upload = Upload
Vue.prototype.$Select = Select
Vue.prototype.$Slider = Slider
Vue.prototype.$CheckboxGroup = CheckboxGroup
Vue.prototype.$Modal = Modal
Vue.prototype.$Checkbox = Checkbox
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1bdebe2-397cc.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1bdebe2-397cc.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?