上次发布的随笔忘记提供源代码了，今天特地来补充，如果有什么问题，欢迎大家为我修改指正。
|
vue.config.js文件：
const path = require(\'path\')
function resolve (dir) {
return path.join(__dirname, \'..\', dir)
}
module.exports = {
// 将entry指向examples
pages: {
index: {
entry: \'examples/main.js\',
template: \'public/index.html\',
filename: \'index.html\'
}
},
// 为packages目录添加babel-loader处理
chainWebpack: config => {
config.module
.rule(\'js\')
.include
.add(resolve(\'packages\'))
.end()
.use(\'babel\')
.loader(\'babel-loader\')
.tap(options => {
return options
})
}
}
datePicker
|
<template>
<div>这是一个datePicker组件</div>
</template>
<script>
export default {
name: \'datePicker\'
}
</script>
datePicker/index.js
|
/* eslint-disable */
import datePicker from \'./src/datePicker.vue\';
datePicker.install = function (Vue) {
Vue.component(datePicker.name, datePicker)
}
export default datePicker
Package/index.js
|
/* eslint-disable */
import datePicker from \'./datePicker\';
const components = [
datePicker
]
const install = function (Vue) {
if (install.installed) return
components.map(component => Vue.component(component.name, component))
}
if (typeof window !== \'undefined\' && window.Vue) {
install(window.Vue)
}
export default {
install,
datePicker
}
examples/main.js
|
/* eslint-disable */
import Vue from \'vue\';
import App from \'./App.vue\';
import datePicker from \'./../packages/index\'
Vue.use(datePicker)
Vue.config.productionTip = false;
new Vue({
render: h => h(App),
}).$mount(\'#app\');
.npmignore文件
examples/
packages/
public/
vue.config.js
postcss.config.js
babel.config.js
*.map
|
|
|
|
|