V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
pytth
V2EX  ›  程序员

在 html 中引入 Vue.js 的 cdn 开发和工程化开发

  •  
  •   pytth · 2023-08-11 09:46:21 +08:00 · 2032 次点击
    这是一个创建于 471 天前的主题,其中的信息可能已经有所发展或是发生改变。

    个人小型开源项目,不想工程化,一方面是考虑降低用户的二次开发难度(有些人不懂工程化构建工具的使用),另一方面我也不喜欢工程化构建方式去开发,比较喜欢在 html 中撸项目。简单学了一下 Vue3 的组合式 API ,感觉可以搞!

    大家觉得个人小项目,在 html 中引入 Vue.js 的 cdn 开发方式,有什么后患?

    19 条回复    2023-08-11 18:45:31 +08:00
    OnlyShimmer
        1
    OnlyShimmer  
       2023-08-11 09:58:56 +08:00
    不能自动压缩打包咯,能有什么后患
    sadfQED2
        2
    sadfQED2  
       2023-08-11 10:11:31 +08:00 via Android
    没后患,当年我接手的屎山项目就是这样用的。不但用了 vue ,还用了 jquery,bootstrap 。一个数据变了永远找不到是哪行代码导致的
    shuxhan
        3
    shuxhan  
       2023-08-11 10:44:54 +08:00
    呵呵我们公司有个项目就是这种风格
    HiCode
        4
    HiCode  
       2023-08-11 10:48:41 +08:00
    先推荐一下:

    https://github.com/dongnanyanhai/vue-web-loader-2

    然后后患就是:

    要自己考虑浏览器兼容性问题,一些比较新的 js 方法,可能在低版本浏览器没有实现。

    但这也不是太大难题,用 https://polyfill.io/v3/url-builder 就可以了。
    wonderfulcxm
        5
    wonderfulcxm  
       2023-08-11 10:50:05 +08:00 via iPhone
    挺好的,只要不往 js 里塞太多东西,SEO 也可以,还不用专门弄 ssr 。
    sparkinglemon
        6
    sparkinglemon  
       2023-08-11 11:07:35 +08:00
    可以搞,但是感觉拿 Vue 一整个怼上去有点重。

    推荐一手 alpinejs https://alpinejs.dev/ 最近在几个纯 HTML 上用了这个体验很好
    lisongeee
        7
    lisongeee  
       2023-08-11 11:09:59 +08:00
    一些缺点:

    - 每次打开网页运行都要编译一次 vue 模板,因为你没有用构建工具提前构建
    - 没有 hmr ,每次更改代码需要手动刷新页面,并且状态丢失

    总结:不如 https://stackblitz.com/ 一根 jb 毛

    楼上那哥们的 vue-web-loader-2 的具体讨论在 https://v2ex.com/t/928423#r_12886465 反正我是不敢用

    我只能说仁者见仁智者见智
    duan602728596
        8
    duan602728596  
       2023-08-11 11:31:54 +08:00
    要是老想着照顾别人,技术也不用发展了。
    wonderfulcxm
        9
    wonderfulcxm  
       2023-08-11 11:39:31 +08:00 via iPhone
    @sparkinglemon 这个还真不错,学习。
    EyebrowsWhite
        10
    EyebrowsWhite  
       2023-08-11 11:53:36 +08:00 via iPhone
    我觉得 vue 就属于工程化的框架,不想用工程化应该考虑换框架,比如楼上提到的 alpinejs 。我推荐一个 htmx
    HiCode
        11
    HiCode  
       2023-08-11 12:50:15 +08:00
    @lisongeee 不适合的场景就不建议适用 vue-web-loader-2 。

    vue-web-loader-2 这个项目就是针对小型,快速,不需要过多团队协作的前端开发场景,非此类需求,建议不要用。
    deacyn
        12
    deacyn  
       2023-08-11 13:50:16 +08:00 via iPhone
    hyzjshwo
        13
    hyzjshwo  
       2023-08-11 13:54:34 +08:00
    只能写在一个 js 文件里吧?浏览器也支持 import ?还是动态 script 载入?
    感觉得不偿失啊
    lyxeno
        14
    lyxeno  
       2023-08-11 14:03:20 +08:00
    项目够小可以。。。涉及到多人协作,光是解决冲突就要命了
    NerbraskaGuy
        15
    NerbraskaGuy  
       2023-08-11 14:11:11 +08:00
    vue3-sfc-loader 了解下,甚至支持 html 页面远程加载 vue 文件
    yangzzzzzz
        16
    yangzzzzzz  
       2023-08-11 14:27:21 +08:00
    会用 vue 的肯定对 vue 的脚手架也熟悉,不熟悉 vue 的即使你 cdn 引入 他还要学 vue 语法。个人感觉不如直接用官方 cli 搭项目 有问题也好解决
    cdswyda
        17
    cdswyda  
       2023-08-11 14:39:22 +08:00
    挺好的,没啥问题,甚至有的时候我会选择 [pite vue]( https://github.com/vuejs/petite-vue)
    pytth
        18
    pytth  
    OP
       2023-08-11 18:43:18 +08:00
    @hyzjshwo script 标签加入一个 type=module 属性
    pytth
        19
    pytth  
    OP
       2023-08-11 18:45:31 +08:00
    @sparkinglemon 感觉不错,体验了一下!
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1736 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 21ms · UTC 16:29 · PVG 00:29 · LAX 08:29 · JFK 11:29
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.