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

[pytth]

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

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

[OnlyShimmer]

不能自动压缩打包咯,能有什么后患

[sadfQED2]

没后患，当年我接手的屎山项目就是这样用的。不但用了 vue ，还用了 jquery,bootstrap 。一个数据变了永远找不到是哪行代码导致的

[shuxhan]

呵呵我们公司有个项目就是这种风格

[HiCode]

先推荐一下：

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

然后后患就是：

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

但这也不是太大难题，用 https://polyfill.io/v3/url-builder 就可以了。

[wonderfulcxm]

挺好的，只要不往 js 里塞太多东西，SEO 也可以，还不用专门弄 ssr 。

[sparkinglemon]

可以搞，但是感觉拿 Vue 一整个怼上去有点重。

推荐一手 alpinejs https://alpinejs.dev/ 最近在几个纯 HTML 上用了这个体验很好

[lisongeee]

一些缺点：

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

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

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

我只能说仁者见仁智者见智

[duan602728596]

要是老想着照顾别人，技术也不用发展了。

[wonderfulcxm]

@sparkinglemon 这个还真不错，学习。

[EyebrowsWhite]

我觉得 vue 就属于工程化的框架，不想用工程化应该考虑换框架，比如楼上提到的 alpinejs 。我推荐一个 htmx

[HiCode]

@lisongeee 不适合的场景就不建议适用 vue-web-loader-2 。

vue-web-loader-2 这个项目就是针对小型，快速，不需要过多团队协作的前端开发场景，非此类需求，建议不要用。

[deacyn]

Vue 官方精简版 3.5Kb ，https://github.com/vuejs/petite-vue?from=thosefree.com

[hyzjshwo]

只能写在一个 js 文件里吧？浏览器也支持 import ？还是动态 script 载入？
感觉得不偿失啊

[lyxeno]

项目够小可以。。。涉及到多人协作，光是解决冲突就要命了

[NerbraskaGuy]

vue3-sfc-loader 了解下，甚至支持 html 页面远程加载 vue 文件

[yangzzzzzz]

会用 vue 的肯定对 vue 的脚手架也熟悉，不熟悉 vue 的即使你 cdn 引入 他还要学 vue 语法。个人感觉不如直接用官方 cli 搭项目 有问题也好解决

[cdswyda]

挺好的，没啥问题，甚至有的时候我会选择 [pite vue]( https://github.com/vuejs/petite-vue)

[pytth]

@hyzjshwo script 标签加入一个 type=module 属性

[pytth]

@sparkinglemon 感觉不错，体验了一下！