最近想学着写点vue的插件,但是碰到模块输出的问题
如图上两段不同的代码,是我在网上找的,左边第②种写法就会报错,但是右边相同的写法都没事
报错:Cannot assign to read only property 'exports' of object '#
附上完整的代码:
1
269// 左边的
var plugin = {};
plugin.install = function(Vue) {
if (plugin.installed) {
return;
}
var get = function(a){console.log('Hello ' +a)}
Vue.prototype.who = get;
Object.defineProperties(Vue.prototype, {
$who: {
get() {
return {get:get}
}
}
});
Vue.mixin({
created: function () {
console.log('Plugin activiated')
}
})
};
// export default plugin;
module.exports = plugin;
// 右边的
/**
* Created by Administrator on 2017-04-01.
*/
var Toast = {};
Toast.install = function (Vue, options) {
var opt = {
defaultType: 'bottom',
duration: '2500'
}
for (var property in options) {
opt[property] = options[property];
}
Vue.prototype.$toast = function (tips, type) {
var curType = type ? type : opt.defaultType;
if (document.querySelector('.lx-toast')) {
// 如果toast还在，则不再执行
return;
}
var toastTpl = Vue.extend({
template: '' + tips + '
'
});
var tpl = new toastTpl().$mount().$el;
document.body.appendChild(tpl);
setTimeout(function () {
document.body.removeChild(tpl);
}, opt.duration)
};
['bottom', 'center', 'top'].forEach(function (type) {
Vue.prototype.$toast[type] = function (tips) {
return Vue.prototype.$toast(tips, type)
}
});
Vue.prototype.$loading = function (tips, type) {
var load = document.querySelector('.lx-load-mark');
if (type == 'close') {
load && document.body.removeChild(load);
} else {
if (load) {
// 如果loading还在，则不再执行
return;
}
var loadTpl = Vue.extend({
template: `
${tips}
`
});
var tpl = new loadTpl().$mount().$el;
document.body.appendChild(tpl);
}
};
['open', 'close'].forEach(function (type) {
Vue.prototype.$loading[type] = function (tips) {
return Vue.prototype.$loading(tips, type)
}
});
}
module.exports = Toast;
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
收藏
新版 webpack 的一个 bug，用 export default 就好了
https://github.com/webpack/we...