用 vue 开发前端，有哪些增加代码可读性的插件？

資深大佬 : tctc4869 0

做一个单页，就类似 var app=new vue(“div”){……}这种

写的代码多了代码阅读渐渐的变得不方便，用 vscode 编写，但找不到类似中 c#的#region 和#endregion 折叠功能，花括号折叠限制，我一开始是 vue 对象代码和 html 代码写在一个文件里，代码量增多后，就考虑拆分文件，把 vue 对象和 html 拆成两个文件，不过即使拆分成文件，vue 对象的 js 代码但还是有阅读不便的问题

这个时候我想念 c#的部分类了，可以把一个类拆成多个文件，不知道 vue 有没有类似的功能，把一个 vue 对象的代码拆成多个 vue 对象的代码，但编译渲染的时候是看成一个的。vue 的话要怎么做到

例如 vue app=new vue(“#DIv”){}; 拆分两个,伪代码 var app1=new vue(“#Div”){};var app2=new vue(“#Div”){};但编译的时候是看成一个对象的

大佬有話說 (21)

資深大佬 : xsephiroth

你是当 JQuery 用了吧
資深大佬 : zhuangzhuang1988

mixin.
資深大佬 : duan602728596

感觉用的太不对
主資深大佬 : tctc4869

@duan602728596
@xsephiroth
难道没有碰到过一个 js 文件定义初始化了一个超过 500 行的对象代码么？一个 vue 对象的定义初始化超过 500 行，而且属性都参与了绑定，有拆分的办法么？
資深大佬 : nieyujiang

n 你是不是对 vue 有什么误会…..
資深大佬 : galikeoy

这是文档都不看直接上手吗，用 vue-cli 吧
資深大佬 : guolaopi

jsdoc?

我也是写 c#的，
写 vue 基本靠注释，
vscode 应该不支持支持 vs 里那种 ctrl m+h 的区域折叠吧
資深大佬 : galikeoy

单文件组件 https://cn.vuejs.org/v2/guide/single-file-components.html
資深大佬 : guolaopi

另外你最后说这个分布类的话你可以参考下 webpack 的 merge 函数，自己搞一个然后拆开写，最后在入口处用 merge 合并你分开写的那些文件，但是这样我觉得是脱裤子放屁。

不要试图把 C#开发习惯带到别处，不然会觉得哪哪都不对劲。
資深大佬 : guolaopi

还有。。。不太清楚你是怎么写的代码，怎么会多到要把 html 和 js 拆成两个文件？我一般都建议 html 模板超过几十行后都要封装成组件调用的。。
資深大佬 : xcstream

后端模板
資深大佬 : ljpCN

单文件组件+ts+class style component+vue-property-decorator
資深大佬 : ljpCN

@ljpCN 另外主的描述很容易让人认为，主不知道把界面拆分成各个组件，而是一个组件写完整个页面。
資深大佬 : cyberpoint

垃圾 vue
資深大佬 : yukiloh

@ljpCN 我把组件拆成过很碎,view 只有标签,一个区域一个组件
但最后搞得传值麻烦,而且有问题找起来也麻烦
資深大佬 : GzhiYi

用 pug
主資深大佬 : tctc4869

@ljpCN
拆分成组件有传值麻烦
資深大佬 : ljpCN

@tctc4869 传值麻烦，vuex 可解
資深大佬 : ljpCN

@yukiloh 了解一下状态管理
主資深大佬 : tctc4869

@tctc4869
我想要的拆分其实是类似下面这种

new Vue({
el: ‘#app’,
data: {
message: ‘Runoob!’
},
methods: {
func2: function () {
this.message = this.message.split(”).reverse().join(”)
}
}
})

new Vue({
el: ‘#app’,
data: {

},
methods: {
func1: function () {
this.message=”123″; //访问 message
}
}
})
資深大佬 : ljpCN

@tctc4869 二已经给了答案： https://vuejs.org/v2/guide/mixins.html#Basics