cdn 方式构建的 vue 项目怎么自定义组件及复用

写过一个 Demo，太不习惯了，除非以后插件支持
gitee.com/cloudfile/chat-vue/blob/master/src/components.js

a.js

function Test() {
return {
template: '<div @click="handle">{{data}}</div>',
data: function () {
return {
data: 1
};
},
methods: {
handle(){
this.data+=5;
}
}
}
}

index.html

<div id="app">
<Child></Child>
</div>
<script>
// 注册
var Child = Test();
Vue.component('course-sort', Test())
// 创建根实例
new Vue({
el: '#app',
components: {
Child
}
})
</script>

@VtoExtension 老铁 你这里面用了 es6 语法吧

https://github.com/FranckFreiburger/http-vue-loader
@TmacV2 #3

呃呃呃，我们是 cli 打包，然后把资源扔到 cdn 上面去

是要古老一点的模块解决方案吗？ seajs 或 requirejs

@runze 6666

@mxT52CRuqR6o5 感谢 新手了解一下

@galikeoy 额 这个编译好放在本地没区别呀

@TmacV2 #9 是啊，就是本地编译完扔 cdn

手写 AMD 模块， 用 require.js 或者 system.js 来加载。

或者直接写 es6 模块， 直接 import， 兼容性差点

大部分前端都是编译好后放到 cdn ；

假定你不想要编译，在 html 页面中直接加载使用 vue 组件，可以参考下面项目：
https://gitee.com/tengzhinei/Vue-rap

https://gitee.com/haimadongli001/jQuery.Vue.js

@HiCode 十分感谢

@HiCode 已经用上了 真香

@TmacV2 我已经用在十几个 H5 项目中，老实说这样来开发效率高，执行效率也不算太低，没有太大的性能损耗。

你用了 Vue-rap 还是 jQuery.Vue.js ？

@HiCode 看你的头像发现第二个项目是你的 xd

@TmacV2 我一开始打算用 Vue-rap，学习一段时间后重构了 jQuery.Vue.js 自用。

@HiCode 哈哈哈 啥时候能支持一下嵌套理由 我跳转到 demo 里 temp 组件里 然后下面有菜单 根据菜单显示子路由 view https://i.loli.net/2020/11/24/6N9qiBDTlJeFpnr.jpg

@TmacV2

“一个页面根据不同标签页切换显示不同的 view ”，不太确定你说的是不是类似 vant 里面的 tab 标签页功能：

https://youzan.github.io/vant/#/zh-CN/tab

tab 标签页的话比较好实现，页面内用一个变量简单控制不同内容的展示即可(v-if 或 v-show)，在点击标签按钮时更改这个变量的值，就会自动切换。

如果你说的“一个页面根据不同标签页切换显示不同的 view ”是指 Vue-rap 里的 layout，可以用公共组件+状态变量来实现。参考 menu.vue ，这个组件监测 menu_active 值的变化。其他引用此组件的页面，在各个页面 mounted 事件中通过 store.set_menu_active 函数修改 menu_active 的值。这样 menu.vue 组件就会自动菜单状态。

而 menu.vue 里面，则可以通过 v-link="'pages/main'"来控制跳转到不同的页面。

例如 menu 组件里标签栏有四个导航标签 ，我就做四个 view 组件，每个组件都引用 menu 组件 。在这些 view 组件各个页面 mounted 事件中通过 store.set_menu_active 函数修改 menu_active 的值吗
那会产生 4 个 menu 组件实例 好像也不对。

第一次做前端项目 提问有点幼稚 请见谅哟

@HiCode 例如 menu 组件里标签栏有四个导航标签 ，我就做四个 view 组件，每个组件都引用 menu 组件 。在这些 view 组件各个页面 mounted 事件中通过 store.set_menu_active 函数修改 menu_active 的值吗 那会产生 4 个 menu 组件实例 好像也不对。第一次做前端项目 提问有点幼稚 请见谅哟

@TmacV2 你的理解没有错，确实会存在 4 个 menu 的实例。我最近打算搞 PC 后台类的系统页面，会增加 layout 的功能。

@HiCode 期待你的更新 回复你之前我想了一下午 最终没想出答案 所以还是问你了

@HiCode 大佬 有没有基于 vue 的 demo 给我学习学习 前端知识点也挺多的 想快点上手

@TmacV2 我自己的学习路径是看各个 vue ui 框架的代码和他们的实现，参考学习他们的思路，例如

https://github.com/heyui/heyui

https://github.com/heyui/heyui-admin

成长比较大还是要靠实际项目，一般我先设定自己想要做什么东西，然后这个东西有哪些项目可以参考，就去看他们思路，然后对着抄一份作业。哈哈哈哈哈哈，所以实在谈不上是大佬。

我其实是 PHP 后端来的，不过现在也准备用 deno，全面改 js 了。

@HiCode 我去码云上找一些简单的后台管理 vue 项目观摩学习一下先

@HiCode 老哥 看到你更新了 jqvue 项目了

@TmacV2 谢谢支持，嗯……我春节撸了一个新的，https://gitee.com/haimadongli001/vue-web-loader

这个可以直接支持 vue-router，并且可以通过 kbone 编译成小程序。

当然，为了保证兼容性 vue 组件里面还是要按 es5 的格式去写，用 es6+部分浏览器会不兼容。

哈哈哈哈哈，谢谢支持！

@HiCode 老哥，你 https://gitee.com/haimadongli001/vue-web-loader 这个项目能开放给我 fork 一下吗？ 找不到了