Features
Package Vue components into SDK
Usage
pack Index: Pack all components in the Entry file.
pack Add：Add components to packaging catalog.
pack Remove: Remove the component from the packaging directory.
pack Build：Package build.
Packaged resource usage
1.vue-cli 环境中使用
// 第一步 index.html中引入资源
<link rel="stylesheet" href="./MsCoe.css">
<script type="text/javascript" src="./MsCoe.umd.min.js"></script>
// 第二步 vue.config.js中
module.exports = {
configureWebpack: {
externals: {
MsCoe: 'MsCoe' // 配置
}
},
devServer: {
host: 'localhost.longfor.sit', // 配置
open: true,
headers: {
'Access-Control-Allow-Origin': '*' // 配置
},
proxy: {
'^/compt': { // 配置
target: 'http://longpay.longfor.sit',
changeOrigin: true
},
}
}
}
// 第三步 入口文件中
import MsCoe from 'MsCoe'
Vue.use(MsCoe)
2.非 vue 环境下
// 第一步 引入vue、element、MsCoe
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script type="text/javascript" src="http://longpay.longfor.sit:8083/MsCoe.umd.min.js"></script>
<link rel="stylesheet" href="http://longpay.longfor.sit:8083/MsCoe.css">
// 第二步 配置本地代理
本地代理配置规则 ^/compt => http://longpay.longfor.sit
Enjoy!
| |
