上次發布的隨筆忘記提供源代碼了，今天特地來補充，如果有什么問題，歡迎大家為我修改指正。
| 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 |
|
|
|
|
