一个测试页面,需要导入一个外部的HTML&js日历插件,一开始出现babel问题,解决完又出现了这个问题,调试了一天实在没辙求大佬们帮忙看看。
【报的错误】(错误描述:HelloWorld.vue?b82f:15 Uncaught TypeError: __WEBPACK_IMPORTED_MODULE_1__js_simple_calendar_js__.a is not a constructor)
报错的是这一行
【test.vue】
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<h2>ssss</h2>
<div id="cal"></div>
</div>
</template>
<script>
import '../css/simple-calendar.css'
import SimpleCalendar from '../js/simple-calendar.js'
var myCalendar = new SimpleCalendar('#cal');
export default {
name: 'HelloWorld',
data () {
return {
msg: 'Welcome to Your Vue.js App'
}
},mounted:function(){
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>
【插件部分HTML代码 simple-calendar.js】
export default SimpleCalendar;
var SimpleCalendar = function () {
//构造函数
function SimpleCalendar(query, options) {
_classCallCheck(this, SimpleCalendar);
//默认配置
this._defaultOptions = {
width: '500px',
height: '500px',
language: 'CH', //语言
showLunarCalendar: true, //阴历
showHoliday: true, //休假
showFestival: true, //节日
showLunarFestival: true, //农历节日
showSolarTerm: true, //节气
showMark: true, //标记
onSelect: function onSelect() {},
timeRange: {
startYear: 1900,
endYear: 2049
},
timeZone: "", //时区
mark: {
'2016-5-5': '上学'
},
theme: {
changeAble: false,
weeks: {
backgroundColor: '#FBEC9C',
fontColor: '#4A4A4A',
fontSize: '20px'
},
days: {
backgroundColor: '#ffffff',
fontColor: '#565555',
fontSize: '24px'
},
todaycolor: 'orange',
activeSelectColor: 'orange',
invalidDays: '#C1C0C0'
}
};
//容器
this.container = document.querySelector(query);
this._defaultOptions.width = this.container.style.offsetWidth;
this._defaultOptions.height = this.container.style.offsetHeight;
//this._options = Object.assign({}, this._defaultOptions, options);
//得到最终配置
this._options = this.optionAssign(this._defaultOptions, options);
this.create();
.....
}
}
export default SimpleCalendar;
放在最后一行