初次上手 Vue.js 开发效率确实高！从此跟 Jquery 说拜拜！

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

› Vue.js

这是一个创建于 928 天前的主题，其中的信息可能已经有所发展或是发生改变。

一些看法

在 V2 看了一些吐槽 Vue 的项目构建的一些文章，有说 node_module 目录太大，webpack 等工具的缺点等问题，但这就是构建 Vue 项目所需的一些操作，嫌麻烦，嫌笨重，可以用其他办法。也可以用官方脚手架等方式，还有新兴的 Vite ，还可以用传统的<script>标签引入 Vue.js 文件去写。

当然这个都是看需求的，如果一个非常简单的页面，用不上太多的 API ，其实用传统的方法去写也是可以的。本人 html 也写了几年，Vue 还真没有认真去学过，偶尔搜一些相关文章看看，也没有认真去写过。

趋势

但越来越多平台、网站已经向单页应用的趋势发展，浏览器无刷新，路由等方式，这种页面体验起来也是非常舒服的，Vue 、React 都是目前构建项目的主流。

有些人觉得学习成本挺高的，还不如直接 jquery 操作 Dom 实在一些,至少不需要将时间和经历花在环境调试和构建。实际上这些都是有很多解决方案的，不想那么复杂就直接 Vite 也可以快速构建。

初体验

顺着 Vue.js 官网的文档，我还是尝试先用传统的引入 Vue.js 文件的方式，花了 2 个上午（因为下午要忙工作），简单得撸了一个项目熟悉一下 Vue 的特性。与 jquery 不同的是，jquery 是操作 Dom ，而 Vue 是操作数据。

后面还是需要认认真真学一下脚手架、Vite 等方式构建项目。。。

Vue

vite

构建

img

95 条回复 • 2022-05-13 18:23:40 +08:00

Ashore

2022-05-11 17:07:46 +08:00

厉害了想拥抱 vue 但是又不知道从何入手。。。

Issuema

2022-05-11 17:13:37 +08:00

vue 毕竟是国人写的嘛，看着中文文档，cv 就可用。只是官网的教程有些功能提都没提，得去 github 看英文说明

codefever

2022-05-11 17:14:17 +08:00

jQuery 以后会退出前端世界，但 jQuery 会长期存活在教科书里成为活化石一样的存在。

hhhanako

2022-05-11 17:14:38 +08:00

你也网上冲浪啦

jswh

2022-05-11 17:24:49 +08:00

致远星战况如何（狗头

darksword21

2022-05-11 17:26:24 +08:00 via iPhone

纯后端，对前端还停留在那种写好文件在游览器打开的程度，所以有个比较蠢的问题想问一下

我看前端现在运行后也都是会开启一个服务，有个端口，这是也类似于后端开发吗？

liyang5945

2022-05-11 17:26:39 +08:00 via Android

3G 网速真快

windyboy

2022-05-11 17:26:50 +08:00

既然是新技术不如试一下 svelte

qzsi001

2022-05-11 17:29:40 +08:00

今年是 2017 年？

pengtdyd

2022-05-11 17:30:14 +08:00

村里通网了？

horseInBlack

2022-05-11 17:30:55 +08:00

@darksword21 #6

前端用 webpack 等打包工具，可以在开发调试的时候配置各种命令，比如开启一个本地 Web 服务，一旦源代码有修改自动重新构建刷新页面，还有跨域代理、处理兼容性等功能，运行这套服务依赖 NodeJS ，确实是后端

开发调试完成，项目上线之前打包程序，也是生成浏览器直接可以读取运行的 HTML/CSS/JS ，本质上还是前端构建页面、处理从后端获取的数据

abersheeran

2022-05-11 17:33:21 +08:00

@windyboy svelte 不能操起 html 就写吧

darksword21

2022-05-11 17:33:32 +08:00 via iPhone

@horseInBlack 那发到部署后还需要 node 吗还是只是本地调试方便的时候用

cmdOptionKana

2022-05-11 17:34:40 +08:00

其实 jquery 不一定比 vue 差，看具体需求，比如楼主做的论坛网站，一般不会动态拉取数据，更可能是做静态化，这种情况下 vue 并没有明显的优势。

（你说为了工作练手、为了好玩我同意用 vue 很好，但你说做论坛明显比 jquery 好却不见得）

（以上 jquery 包含 dom api 抄 jquery 的语法）

HelloWorld556

2022-05-11 17:36:50 +08:00

部署后一般用 Nginx @darksword21

chloerei

2022-05-11 17:37:00 +08:00

vue/react 和 jQuery 不是直接替换关系。

可以看看 https://youmightnotneedjquery.com/ ，jQuery 现在变得不重要的原因主要是被浏览器原生 API 替代了，例如 querySelector 和 Fetch API ，这些新的原生 API 都从 jQuery 学了不少东西。

SPA 比 SSR + 少量 js 操作开发效率要高吗？我觉得不一定。像顶楼的例子是个论坛，考虑下 SEO 咋整？

horseInBlack

2022-05-11 17:41:41 +08:00

@darksword21 #13

打包以后就是 HTML/CSS/JS 和其他静态资源啊，都是浏览器直接运行的文件，现在前端写的那些框架，.vue / .jsx / .less 也不可能直接让浏览器全都支持，还是要翻译成浏览器能认识的文件

就好比高级语言写的代码要编译以后运行

现在前端的框架就是用更加简单更加符合人类直觉的写法写程序，把管理资源、处理兼容性等问题交给框架处理，最后让打包工具打包出来浏览器运行的文件

前端框架能做的那些事，直接手写 JS 肯定也能做到，理论上来说可以更好，但是那得要求编码人员拥有相当不错的水平，作为平庸的大多数之一我还是喜欢把这些事交给框架处理

FreshOldMan

2022-05-11 17:43:29 +08:00

大清亡辣

misaka19000

2022-05-11 17:48:24 +08:00

我倒，你也网上冲浪啊🙃

libook

2022-05-11 17:52:48 +08:00

https://youmightnotneedjquery.com/
这些新出的原生 Web API 替代了 jQuery 。强烈建议自己用原生 Web API 写一个具备一定交互功能的现代网页试试，借助最新的 Web 特性，写起来也挺方便的。

框架其实以前也有，比如 Backbone 和 Angualr ，Vue 如今也是发展到了第三代； jQuery 提供给开发者更方便地操作 DOM 的方案，框架是从另一个角度来满足生产需求，即不需要自己操作 DOM ，而是由框架来完成 DOM 的操作，自己只需要写业务逻辑。

Vue 的文档是我度过的最贴心的的文档之一，总能在我看到产生疑问的地方马上就解答我的疑问。

darksword21

2022-05-11 17:58:03 +08:00 via iPhone

@horseInBlack 感谢！

Liuman

2022-05-11 17:58:21 +08:00

我晕，你也网上冲浪啊

windyboy

2022-05-11 18:01:39 +08:00

@abersheeran 没看明白，什么叫 “不能操起 html 就写吧”

wonderfulcxm

2022-05-11 18:01:52 +08:00 via iPhone

seo 不好

feitxue

2022-05-11 18:01:54 +08:00

@darksword21 哈哈.大兄弟你这 100%纯后端啊,一点前端东西不用碰..羡慕...

byx

2022-05-11 18:23:47 +08:00

你是 MM 还是 GG~

learningman

2022-05-11 18:37:47 +08:00

@codefever 你这个以后是多少年啊，IE 都还没退出呢

Troevil

2022-05-11 18:41:04 +08:00

@windyboy #23 他应该指的应该是无需编译可以直接运行吧

shakukansp

2022-05-11 18:43:04 +08:00

现在如果是面向传统多页面的应用，要使用现代框架还有 ssg 这个办法
也基本上就是操起 html 就写

darknoll

2022-05-11 19:15:07 +08:00

大明亡了啊

codingBug

2022-05-11 19:16:53 +08:00

上个世纪？？？

grewer

2022-05-11 19:19:48 +08:00

这已经不是火星了

konata

2022-05-11 19:30:48 +08:00

管它前端怎么样美化，我只用写好能返回的 json 就可以了

yaphets666

2022-05-11 20:09:29 +08:00

@wonderfulcxm serve side render 了解下

dcsuibian

2022-05-11 20:25:57 +08:00

乐观估计 5 年内还能看到这种帖子。
但还是恭喜。

wonderfulcxm

2022-05-11 20:35:28 +08:00 via iPhone

@yaphets666 简单问题复杂化，又包一层而已，没有什么计算机问题不是多加一层能解决的，而后端渲染天然就是 ssr 。现在不是增加一层解决了一个原来不存在的问题，同时增加了就业机会。

DOLLOR

2022-05-11 20:39:28 +08:00

@wonderfulcxm
现在的后端都不愿接触 HTML 、CSS 、JS 了，前端也不想在自己电脑上跑个后端项目写页面。
不如干脆彻底分工，前后端各自在自己的领域卷卷卷。

star7th

2022-05-11 20:40:57 +08:00

如果你是后端程序员的话，还可以理解，毕竟对你来说是打开了一个新世界大门。如果你是前端开发，我只能说你要学的还有很多很多。。。

licoycn

2022-05-11 21:45:55 +08:00

不管怎么变，前端后端我都要！！！

zeroxia

2022-05-11 21:48:50 +08:00

请推荐 vue.js v3 的书籍！

fayetitus

2022-05-11 21:54:49 +08:00

我，我在 2022 ？

yeqizhang

2022-05-11 21:58:56 +08:00 via Android

骚年，来写 jsx 吧

iwdmb

2022-05-11 22:06:29 +08:00

記得 all in TESLA

pytth

2022-05-11 22:08:05 +08:00 via iPhone

@liyang5945
@pengtdyd
@qzsi001
@hhhanako
@FreshOldMan
@misaka19000
@Liuman
@darknoll
@codingBug
@grewer
@fayetitus

平时写后端比较多，前端知识还停留在 2016 年那时候的水平，只是觉得这两年很火爆，被吸引到了，就尝试拥抱时代，拥抱新技术。

pytth

2022-05-11 22:09:20 +08:00 via iPhone

@libook 确实原生的写法可能会更纯粹吧

pytth

2022-05-11 22:11:21 +08:00 via iPhone

@darksword21 现在的前端写好了不一定可以在浏览器打开，因为浏览器不认识，通过一些工具编译后，编译成 html,csa,js 才能部署到服务器。

开发的时候，需要浏览器进行预览，调试，所以需要开启这个本地服务作为开发环境。

pytth

2022-05-11 22:13:13 +08:00 via iPhone

@codefever 就像谭浩强的 C 语言程序设计那本书一样，很多代码已经不能跑了，而现在大部分的学校还作为课堂的教科书。

duke807

2022-05-11 22:25:13 +08:00 via Android

用了一圈下來，發現還是這個框架最好：vanilla-js.com

acoldfox

2022-05-11 22:25:33 +08:00

看了楼主又看了一楼的回复，有种翻到坟贴的感觉

haah

2022-05-11 22:43:23 +08:00

我个人觉得——你可能想多了！

quanjw

2022-05-11 22:43:33 +08:00

然后又要学 ES6 一个头两个大

techstay

2022-05-11 23:07:54 +08:00

vue3 是真的不错，速度很快感觉

crazykay

2022-05-12 01:01:53 +08:00 via Android

缩圈了，拥抱纯 Web component 和 deno.js 。别的我都没兴趣搞。

abcd191898105

2022-05-12 01:15:56 +08:00 via Android

@Issuema 鱿大是外国人，别套近乎，搞得好像跟你很熟似的。人家气场也和你不一样。

agagega

2022-05-12 01:30:59 +08:00

或许你还可以了解一下 Stimulus ？

vHypnos

2022-05-12 01:33:55 +08:00 via iPhone

作为 react 老手，刚开始写 vue2 真的被 sfc 折磨的不行。正在积极推进组内换 vue3+nuxt 。。然后看看能不能写 tsx

Felldeadbird

2022-05-12 09:14:21 +08:00

VUE 合适单页应用，不在于 SEO 的应用环境。VUE 相比起传统的模式，编写的业务更加需要细致化。例如：如何保存历史页，刷新保持当前页。页面跳转，页面回顶部。而不是停留在当前浏览区域。官方文档都有说到上面的问题，也有解决方案。但是正常开发如果没留意这些，很容易就造成体验很奇怪的现象。

JQ 我现在还在用，两者我觉得是互补，而不是谁替代谁的关系。

ikaros

2022-05-12 09:23:15 +08:00

我还在用服务端渲染和 jQuery, 主要优势是对于内容平台来说 SEO 比较友好 vue 这些有什么解决方案吗

yaphets666

2022-05-12 09:35:15 +08:00

@wonderfulcxm 啥叫简单问题复杂化。。。vue 能极大提升开发效率啊，使用工具叫简单问题复杂化？

C603H6r18Q1mSP9N

2022-05-12 09:50:21 +08:00

flutter 是为了移动端和嵌入式；
h5 太臃肿了，或者不好用；就比如有了 jquery 为什么还要 vue ，虽然 vue 做的事，jquery 大部分也能做，只是繁琐很多

abersheeran

2022-05-12 09:51:14 +08:00

@windyboy 在 html 里写一个 script 从 CDN 引入一下，就可以开始写，而不是需要下载一个 nodejs 环境跑各种命令。

longzn

2022-05-12 09:51:51 +08:00

什么明年北京要办奥运会了！！！！

sickoo

2022-05-12 09:57:16 +08:00

solid.js

iovekkk

2022-05-12 09:59:37 +08:00

赶紧买房，21 年会暴涨一波

DreamCMS

2022-05-12 10:01:24 +08:00

我还是觉得 jq 好，如果以后前端都打包形式的话，不利于前端技术的发展

LavaC

2022-05-12 10:02:25 +08:00

页面不太复杂的话可以用 Alpine.js 这种轻量化框架。

Dragonphy

2022-05-12 10:09:12 +08:00

@zeroxia #40
《 Vue 设计与实现》

seamonster

2022-05-12 10:17:10 +08:00

我自学 vue 写的舔狗网站： https://wedog.ru

h1104350235

2022-05-12 10:17:17 +08:00

俺们村也连上 4G 了

pytth

2022-05-12 10:31:42 +08:00

@iovekkk 刚好去年买了~坐标广州

pytth

2022-05-12 10:32:47 +08:00

@shanghai1998 因为我看到太多人吐槽 jquery 来秀 vue 的优越感了...

pytth

2022-05-12 10:33:58 +08:00

@Felldeadbird jquery 我还在用的原因就是有个比较方便的 ajax

iovekkk

2022-05-12 10:35:47 +08:00

@pytth 你这是高位的时候买的啊

DOLLOR

2022-05-12 10:59:42 +08:00 via Android

@DreamCMS
恰好相反，正是打包工具链的存在促进了前端的发展，否则前端今天还在写 ES3 调兼容。

cangcang

2022-05-12 11:15:23 +08:00

@pytth 嗯，现在前端代码要用 babel 编译已经是基操了

gam2046

2022-05-12 11:22:18 +08:00

vue 真心入门简单，有点其他语言基础的，缝缝补补，看一天就能写个还凑合的前端了。屏蔽的很多技术细节。

electron 这种采用 vue 开发 UI ，速度也挺快的。我已经好几个需要 UI 的项目都采用 electron + vue 开发了，不图别的，就是简单。当然如果只需要 Windows ，C#那一套也很简单。