作者aa12783509 (沒了重心)
看板Web_Design
標題[問題] Vue的學習與使用方式請教
時間Mon Oct 19 08:25:10 2020
各位前輩好 目前在Vue的學習上面遇到了一些問題 想向各位請教
目前因為工作上的需求 使用了Vue 也自學了Vue
現在遇到一個問題是 目前公司的專案
是利用一般網頁的寫法在製作的 而不是透過template模板的方式
在前端html的部分利用Vue來處理 例如： v-model v-bind......
下方的js部分 是使用這類的方式製作
https://imgur.com/a/MO8GE2C
透過API送到C#的ApiController去使用
因為我都是自己自學而成的 可能很多觀念都建立的不夠熟悉
所以公司要求我們再看個幾本書籍
但公司裡面有的書籍內容都是使用Vue-cli的教學方式 webpack的打包方式
建立出來的範例檔案 都是類似這樣的
https://imgur.com/a/2oX6FwV
這樣的專案方式 看的非常的吃力 也非常的不熟悉 完全是不同寫法
我想要詢問說 外面的公司 在Vue的使用方式是上者較多還是下者
那有沒有比較推薦類似上者用法的書本或者是線上課程
有沒有什麼知識 或者是什麼功能 是好用的 是必備需要會的 (上者)
假設未來會有想換公司的想法 有沒有什麼是需要補足的(如果只單純會上者的話)
不確定這樣的表達方式是否清楚 在這邊與各位請教
在這邊感謝各位分享與解答了 謝謝各位的幫忙
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 218.173.153.155 (臺灣)
※ 文章網址: https://webptt.com/m.aspx?n=bbs/Web_Design/M.1603067112.A.AAE.html
1F：→ ssccg: 個人經驗是new Vue這種通常是現有專案再導入Vue.js，或是網 10/19 09:32
2F：→ ssccg: 頁上只有一部分要用Vue做。整個用Vue的新專案就會用vue-cli 10/19 09:33
了解了 明白!! 那這樣有可能是因為公司的現有專案
在html的部分 想要導入Vue的用法 所以直接用new Vue的做法去做就好了~~~
那我想問一下 其他外面的公司 有提到如果是有使用Vue此技能的公司
大部分 都是使用上者還是下者多呀????
※ 編輯: aa12783509 (61.221.174.36 臺灣), 10/19/2020 09:38:20
3F：→ ssccg: 不過兩者在view的部分都一樣啊? 只差在template放在哪而已 10/19 09:37
4F：→ ssccg: 沒另外寫就是拿el的html當template而已 10/19 09:41
不好意思 有點對於你上面這兩句話不太懂 想問一下有什麼範例 可以舉例嗎?
※ 編輯: aa12783509 (61.221.174.36 臺灣), 10/19/2020 09:42:37
7F：→ ssccg: vue-cli就只是用webpack組裝起來，架構是一樣的，我是覺得 10/19 11:02
8F：→ ssccg: 沒有分到只會一種 10/19 11:05
9F：→ ssccg: 你覺得不一樣的其實是node.js生態系的東西，不是Vue的部分 10/19 11:13
依照你這兩張圖片來看 看起來是很相似的
可能真的只是單純寫法不同 讓我視覺上看起來是兩種不同的東西
我這邊比較了解的 是第一張圖這樣
實際工作上面 可能連template的部分也很少有用到
就是直接使用原生的html標籤
搭配new Vue來綁定一些資料或者是function的部分
不過Vue-cli他的檔案關聯的部分 有點混亂就是了QQ
所以第二張圖是指node.js生態的東西嗎?
這邊順帶想問一下 她明明外層有一個index.html
但是我看他裡面沒有掛其他的js檔案 為什麼他會是直接吃main.js的檔案?
※ 編輯: aa12783509 (61.221.174.36 臺灣), 10/19/2020 14:27:00
10F：→ oToToT: 我之前也一直搞不懂，上次寫了一遍Nuxt就感覺比較懂了XD 10/19 14:38
這個好像之前有看過Nuxt好像也是從Vue變來的樣子!!??
11F：→ ssccg: 因為webpack/vue-cli會用main.js當進入點，將所有用到的.js 10/19 15:22
12F：→ ssccg: .vue打包起來，然後在index.html中插入script連結 10/19 15:23
13F：→ ssccg: 沒打包前這些原始檔用瀏覽器開是沒東西的 10/19 15:24
14F：→ ssccg: 而index2.html這種是可以直接在瀏覽器開的普通html+js 10/19 15:28
15F：→ ssccg: node.js生態是指這種模組化的專案結構和用到的工具 10/19 15:46
你這樣一講 至少可以知道原因了!!!
我有操做到 去做build的時候 他打包出來就是一個index的頁面而已
跟CSS以及javascript的檔案(印象中 如果沒記錯的話)
那這樣的話 外面一般的公司 會有人用new Vue的做法做嗎?
還是通常做專案 都是要用後者的方式呢!!?
※ 編輯: aa12783509 (61.221.174.36 臺灣), 10/19/2020 16:04:01
16F：推 sylviami: 就我所知一般要求前端框架技術的公司大多是後者，如此才 10/20 01:52
17F：→ sylviami: 會真正達成前後端分離的目的 10/20 01:52
OK 了解了 謝謝您的 回答~~~
那我想問一下 這樣的話 在後者的使用上 有沒有什麼部分是需要知道的
因為我怕我是自學 知道的東西很片面 不是很完整的QQ
想找時間補足!!!!
※ 編輯: aa12783509 (61.221.174.36 臺灣), 10/20/2020 16:07:42
18F：推 shter: 我公司就是兩種都有，舊專案為了效能把 jQuery 改 Vue 10/20 23:20
19F：→ shter: 就會使用 new Vue 把原本的 template 塞進 Vue 跑 10/20 23:21
20F：→ shter: 兩種都有在用，即使是新專案有些規模不大的也不會打包 10/20 23:21
21F：→ shter: 還很多直接 cdn 引入 Vue Vue-router Vuex 的 10/20 23:21
22F：→ shter: 兩者只是進入點不同而已，功能是一樣的，沒啥差別 10/20 23:23
了解了!!! 目前我自己的規劃是 有找到一本書
裡面的寫法與內容 是使用new Vue的方式再做範例的!!!
目前先想把這本書看完 至少學到的東西想使用在公司的專案上
也比較好上手!!! 比較清楚該如何去做
然後再看公司提供的書 是用Vue-cli的做法去做的!!!
23F：→ ssccg: 功能略有差別，只是不一定會用到，像.vue可以用scoped css 10/21 16:23
※ 編輯: aa12783509 (61.221.174.36 臺灣), 10/23/2020 13:44:20
24F：推 hermes018: 看官網的教學就可以學的很好了 10/24 03:32