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

初学 Vue 的几个问题,求解!

  •  
  •   acbot · 2022-07-13 18:18:19 +08:00 · 2904 次点击
    这是一个创建于 863 天前的主题,其中的信息可能已经有所发展或是发生改变。
    1. 使用 WebStorm 创建 Vue 项目如果勾选 “Use the default project setup (babel,eslint) ”那么 vue-cli 默认创建的就是 Vue3 项目,可以修改默认创建版本吗? 当然这个可以取消这个勾选然后创建的时候手动选择,但是我想应该是有配置或者是方式可以修改默认创建版本的。

    2. 每次创建一个新的项目都会在项目目录中新生成 node_modules 一个目录然后去下载相应的包,总之感觉这样操作很浪费时间和占用空间,很不合理,不知道是不是我没有配置或者是使用错误的原因,能不能像 java 的 maven 那种包管理方式,同样的包下载一次有依赖的项目直接引用就可以了。npm 好像可以使用 -g 参数全局安装一些包,这个能解决问题吗,其实就算能解决这个问题感觉涉及也不合理

    3. Vue.js devtools 在很多资料中都说 Vue2 和 Vue3 要使用不同的插件 Vue3 要使用带 beta 字样的那个版本, 但是我实际使用过程中 就用普通的 Vue2 的新版本 devtools 插件一点也没有发现问题啊,反而使用 beta 字样版本的很多时候卡和无法使用, 这个问题到底是 Vue2 新版本插件增加了对 Vue3 的支持还是什么原因

    4. npm build 的两个问题:1 )有详细的资料介绍 打包后 CDN 优化的资料吗,网上看过一些感觉写的都不详细,2 )打包的时候命名规则能自定义吗,我经常看到打包后的 js css 和一些样式的名字都要带一串数字 感觉很 low

    5. 使用 Vue 开发的微信小程序,是如何转换成小程序的呢,Vue 的编译过程转换成了小程序标准的代码 还是本身小程序就可以混用 Vue 代码呢

    23 条回复    2022-07-14 16:28:07 +08:00
    wunonglin
        1
    wunonglin  
       2022-07-13 18:28:04 +08:00
    1 、用 vue-cli 创建项目,而不是用 WebStorm 。
    2 、把 maven 的概念放一边,每个项目有自己的 node_modules 。
    4 、编译后会有哈希字符名,是为了上线可以不影响原有版本和防止浏览器缓存
    5 、这段话的逻辑应该改为:用 uniapp 开发小程序。uniapp 使用了 vue 作为开发(语言|框架),需要编译成为小程序代码。
    acbot
        2
    acbot  
    OP
       2022-07-13 18:58:31 +08:00
    @wunonglin

    1. 使用 vue create 和取消 WebStorm 创建项目过程中的 “Use the default project setup (babel,eslint) ” 的效果一样,仅仅多了一个选择版本的步骤,我的意思是如何修改这个默认版本 可以在创建的时候不选择

    2. 这个包的管理概念也不是 maven 独有的,但很明显比较下来 Vue 或者是 node 的这套方式不论从效率还是什么角度都感觉落后很多

    4. 如果是因为缓存的问题,我们新版本完全可以配置新的名称啊,或者说我本身就是一个新项目那来的缓存问题。哪怕有其他的考虑,那么我们只问框架的涉及中有能配置名称的地方吗?

    5. 有介绍这个转换过程的资料吗或者说这个过程我去百度的话应该搜索什么关键字呢
    Dragonphy
        3
    Dragonphy  
       2022-07-13 19:07:36 +08:00
    1. 版本是指 Vue 2/3 大版本?两个区别还是挺大的,新项目建议直接上 Vue3 ,也别用 Vue-cli ,创建的项目使用的是 webpack 。人生苦短,使用 Vite
    2. 没错,node_modules 就是这么烂,使用 pnpm 提升一定体验
    3. Vue2 、Vue3 都可以使用正式版本
    5. Vue 本身无法开发微信小程序,uniapp 使用 Vue 开发微信小程序,有坑,但需要你细心查阅 uniapp 官方文档。
    acbot
        4
    acbot  
    OP
       2022-07-13 19:36:25 +08:00
    @Dragonphy

    1. 版本就是指 Vue 2/3 大版本
    3. 之前看的资料就说 Vue.js devtools 要根据大版本选择不同的插件,但实际商我使用 Vue.js devtools 新版本插件 Vue 2/3 开发都没有问题
    chnwillliu
        5
    chnwillliu  
       2022-07-13 19:56:52 +08:00 via Android
    4. 一个网站一天一发布甚至一天发布好几次,发布一次就人为改一次名称么?显然不现实。就算改你打算怎么起名字? script_v1 script_v2 么? content hash 有什么不好的。这都是 web 发展这么多年来大家总结出来的行之有效的方案。
    acbot
        6
    acbot  
    OP
       2022-07-13 20:06:07 +08:00
    @chnwillliu 所有项目都有这么频繁的修改频率吗,或者说低频率或者说上线后就不修改的项目就不能用 Vue 了吗? 这种自动规则生成的东西,总感觉就是使用 int a, int b 这种定义变量的编程方式一样的。
    BealuoC
        7
    BealuoC  
       2022-07-13 20:15:21 +08:00
    @acbot 换低版本的 vue-cli 就好了,低版本是 vue2
    chnwillliu
        8
    chnwillliu  
       2022-07-13 20:17:15 +08:00 via Android
    @acbot 你把编译生成的文件和代码想象成传统编译语言生成的产物,就不会纠结它生成了什么代码,生成的文件用了什么命名规则了。那些重要吗?并不。你把整个 dist 目录当作一个整体,给个服务器一 host ,浏览器里就能跑了,这就行了。debugging 自有 source mapping 处理。就跟 C 语言编译生成了什么样的二进制文件内容,我们并不关心,只要它确实还原了源代码的意图,就 ok.
    Bingchunmoli
        9
    Bingchunmoli  
       2022-07-13 20:26:28 +08:00
    1. 旧版本默认旧版本,新版本默认新版本,并根据支持时间进行弃用(default 默认均为这样这是 vue-cli 的默认配置,低版本目前最新的 vue-cli 就是每次设置的因为推荐新版本)
    2. 这个是前端 文件复用的问题(),不过因为早期 npm 容易炸,每个项目一份出现问题删除重新 npm i 没有大的严重后果
    3. vue bate 版本的时候需要不同的 vue dev 插件,而 vue 发布 vue3 新版本后,旧插件直接升级为支持 vue3 的插件,而 bate 已停止更新
    4. 1 ) cdn 优化难道不是 cdn 厂商测修改吗,
    2 ) webpack 配置我记得可以改,但是 hash 是市场和需求决定的(满足大部分人的默认设置,允许特殊需求自定义)
    5 。 微信小程序是正常开发的吧导入 vue 的库而已
    wunonglin
        10
    wunonglin  
       2022-07-13 20:33:00 +08:00
    @acbot #2

    2 、确实垃圾。
    4 、缓存是指浏览器缓存。正常情况下浏览器(或者 cdn )会对静态资源进行缓存。缓存相关问题自己搜就好了。
    5 、uniapp 是个商业公司的产物,对于开发者不需要了解它是如何运行的,除非你是要开发 uni 的库。
    GeruzoniAnsasu
        11
    GeruzoniAnsasu  
       2022-07-13 20:35:43 +08:00
    @acbot 不要拿你后端的思维去看前端。。

    1. 你写的 APerfectConceptType a_perfect_named_var 最后也会被编译器处理,或混淆或丑化或 mangle ,你永远不需要关心也不应该关心你源码里写的变量名变成了什么,正如你不需要关心打包后名字变成了什么一样。后端语言有 source map ,把编译结果映射回源码里的行号,前端一样有。

    2. 前端 app 是个可随时热更新的单页面,热更新要替换加载新文件,后端实现热更新可能 diff 的是文件 hash 、文件头签名,但前端在准备更新时新旧文件处于网络的两端,diff 文件内容成本昂贵,所以能比较容易 diff 的就是文件名或者说版本标识号。

    3. 使用 vite ,版本滚动的次数=你编辑焦点离开文件的次数,自动随机标识号就理所当然天经地义了。



    另外 前端技术的过期时间普遍小于两年,如果你对找到的教程内容有异议,先找找这篇东西的**原始作者**的发布时间。2020 年前的别看。
    acbot
        12
    acbot  
    OP
       2022-07-13 20:57:27 +08:00
    @chnwillliu 你说的有到底,其实我觉得主要就是 这个东西编译出来我们还能看见所以就觉得不那么爽! C 语言这些编译出来你不能直接看到所以就没有感知 可能就是 眼不见心不烦
    acbot
        13
    acbot  
    OP
       2022-07-13 21:00:30 +08:00
    acbot
        14
    acbot  
    OP
       2022-07-13 21:05:19 +08:00
    @Bingchunmoli

    1. 就是不能通过参数或者是配置文件修改咯?

    2. 所以应该与时俱进一下,如果仅仅是一个项目区别不大,项目多了真的感觉太费时间空间!

    4. cdn 优化可能我描述不太准确,这个问题就暂且放下
    jolanyu
        15
    jolanyu  
       2022-07-13 21:14:21 +08:00
    建议使用 vite 创建项目
    AyaseEri
        16
    AyaseEri  
       2022-07-13 22:02:06 +08:00
    2. 换用 pnpm 进行依赖管理
    4. build 只管转译与打包,管不了 CDN 优化
    Bingchunmoli
        17
    Bingchunmoli  
       2022-07-14 00:41:28 +08:00
    @acbot 1. 目前我是不会
    2. 这个我也觉得,但是 npm 早期我用的时候天天 error(修改依赖关系就容易错误)需要删除重建,反而觉得这个是好设计
    acbot
        18
    acbot  
    OP
       2022-07-14 08:36:48 +08:00
    @AyaseEri

    谢谢

    2. pnpm 这个我先去了解了解

    4. cdn 优化可能我描述不太准确,这个问题就暂且放下
    acbot
        19
    acbot  
    OP
       2022-07-14 08:37:29 +08:00
    @jolanyu

    谢谢

    vite 这个我得重新了解
    ivencooli
        20
    ivencooli  
       2022-07-14 09:09:37 +08:00
    node_modules 的问题,得引出我收藏的图了
    <img src = 'https://i.bmp.ovh/imgs/2022/07/14/3e0cd72c6c54d9b1.jpg' />
    ivencooli
        21
    ivencooli  
       2022-07-14 09:12:39 +08:00
    @ivencooli #20 好像图片有问题,看看这个
    https://i.bmp.ovh/imgs/2022/07/14/3e0cd72c6c54d9b1.jpg
    acbot
        22
    acbot  
    OP
       2022-07-14 10:22:30 +08:00
    @ivencooli 这个图很能说明问题
    sjhhjx0122
        23
    sjhhjx0122  
       2022-07-14 16:28:07 +08:00
    1.还是用命令创建比较好,现在新的命令可以不用 vue-cli 直接 npm init vue@3 就好
    2.npm -g 并不能解决这个问题,可以用 pnpm 装
    3.这个工具其实并不是那么重要
    5.最好还是别用 uniapp 实在不敢使用,taro mpx 可以试试
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2666 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 04:17 · PVG 12:17 · LAX 20:17 · JFK 23:17
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.