首页   注册   登录
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
vue.js
V2EX  ›  Vue.js

迫于龟毛,写 vue 单文件组件的时候,你们都习惯怎么放<template><script>和<style>的顺序?

  •  
  •   shintendo · 180 天前 · 652 次点击
    这是一个创建于 180 天前的主题,其中的信息可能已经有所发展或是发生改变。

    官方的 style guide 推荐 template、script、style 或者 script、template、style,并且强调 style 放最后(因为是可选的)。

    我从来没试过把 script 写最上面,因为这块通常是最长的,放头上怎么想都觉得很奇怪。

    我自己用过 template、style、script 和 template、script、style 这两种写法,都用了相当长时间,我觉得 template 放第一位最大的好处在于,打开一个文件的时候,看 template 更能一目了然地知道它是什么组件。但是不爽的地方在于,如果我把 script 放中间,那么写样式的时候就要上下滚动很长的距离(写样式需要在 style 和 template 之间来回看);反之如果把 style 放中间,写 script 又不方便了。

    我现在的写法是 style、template、script,因为写 style 和写 script 的时候经常都需要对照 template,这样把 template 夹在中间让两者都很方便,而 style 和 script 通常互不影响,离得远也没事。但是坏处是,首先看上去比较别扭(不过习惯了也还好,而且我后来一想,这不就是传统 html 里的书写顺序吗,head 里放样式,body 里放内容,body 底部放脚本,这么一想,还越看越顺眼了)。还有一个问题是打开一个文件,首先看到的是 CSS,无法一目了然地看出这是个什么组件。而且我翻遍了相关讨论,也没见过一个像我这么写的。

    不知道各位大佬的习惯是怎么样。

    5 回复  |  直到 2018-12-28 17:20:39 +08:00
        1
    phpcxy   180 天前
    用 IDE,随便啦~
        2
    imherer   180 天前
    template、style、script
    因为一般 style 都比较短,基本上小于另外两者
        3
    shuirong1997   180 天前
    template、script、style (至于楼主提到对照的事儿,我一般通过再开一个 Tab 解决)
        4
    Lxxyx   180 天前 via Android
    style, templates, script,好处在于 template 会引用到 style 和 script 的代码,这样可以鼠标少滚动一点点
        5
    V2exUser   180 天前 via Android
    vscode,左侧列表有大纲,点击直达。如果没有,升级版本
    关于   ·   FAQ   ·   API   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   3182 人在线   最高记录 5043   ·   Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.3 · 22ms · UTC 04:26 · PVG 12:26 · LAX 21:26 · JFK 00:26
    ♥ Do have faith in what you're doing.
    沪ICP备16043287号-1