本篇文章給大家談?wù)剉ue版本2和3怎么看，以及vuecli查看版本對應(yīng)的知識(shí)點(diǎn)，希望對各位有所幫助，不要忘了收藏本站喔。

本文目錄一覽：

• 1、vue2.0和3.0區(qū)別
• 2、vue3.0和2.0的區(qū)別是什么？
• 3、vue2與vue3的區(qū)別
• 4、Vue2和Vue3的區(qū)別
• 5、vue-cli2版本跟3版本中的區(qū)別

vue2.0和3.0區(qū)別

項(xiàng)目目錄不同

1、vue-cli3.o移除了config.文件夾。

2、多了vue.config.js文件。

3、新增了一個(gè)views文件夾。

4、刪除了static新增了public文件夾。

5、index.html移動(dòng)到public了。

配置項(xiàng)不同

1、vue-cli2.0的域名配置，分為開發(fā)環(huán)境和生產(chǎn)環(huán)境。

2、所以配置域名時(shí)，需要在config中的dev.env.js和。

3、prod.env.js中分別配置3.0 config.文件已經(jīng)被移除。

4、但是多了。env.production和env.development文件。

5、除了文件位置，實(shí)際配置起來和2.沒什么不同。

創(chuàng)建項(xiàng)目的方式不一樣

1、vue-cli2.0，vue init webpack項(xiàng)目名。

2、vue-cli3.0 vue create項(xiàng)目名。

vue3.0和2.0的區(qū)別是什么？

vue-cli2.0與3.0在目錄結(jié)構(gòu)方面，有明顯的不同。

vue-cli3.0移除了配置文件目錄，config 和 build 文件夾。

同時(shí)移除了 static 靜態(tài)文件夾，新增了 public 文件夾，打開層級目錄還會(huì)發(fā)現(xiàn)， index.html 移動(dòng)到 public 中。

配置項(xiàng)，3.0 config文件已經(jīng)被移除，但是多了.env.production和env.development文件，除了文件位置，實(shí)際配置起來和2.0沒什么不同。

沒了config文件，跨域需要配置域名時(shí)，從config/index.js 挪到了vue.config.js中，配置方法不變。

Vue3.0不論是原生的html標(biāo)簽還是vue組件，他們都會(huì)通過h函數(shù)來判斷，如果是原生html標(biāo)簽，在運(yùn)行時(shí)直接通過Virtual Dom來直接渲染，同樣如果是組件會(huì)直接生成組件代碼。

數(shù)據(jù)監(jiān)聽，Vue2.x大家都知道使用的是es5的object.defineproperties中g(shù)etter和setter實(shí)現(xiàn)的，而vue3.0的版本，是基于Proxy進(jìn)行監(jiān)聽的，其實(shí)基于proxy監(jiān)聽就是所謂的lazy by default。

版權(quán)聲明：本文為CSDN博主「水墨-青花」的原創(chuàng)文章，遵循CC 4.0 BY-SA版權(quán)協(xié)議，轉(zhuǎn)載請附上原文出處鏈接及本聲明。

vue2與vue3的區(qū)別

? ? ? ?最近接觸并了解了vue3，發(fā)現(xiàn)vue2的語法vue3能夠繼續(xù)使用，并沒有任何影響，但是vue3還是和vue2有很大區(qū)別的

1.template標(biāo)簽

? ? ? ?我們在使用vue2的時(shí)候，template標(biāo)簽只能寫一個(gè)元素，所以我們要用一個(gè)大的盒子把里面的元素包起來，但是vue3中卻解除了這個(gè)限制，也就是說，一個(gè)template標(biāo)簽中可以寫多個(gè)標(biāo)簽

2.建立數(shù)據(jù)

在vue2中，我們在寫需要的數(shù)據(jù)的時(shí)候需要在export?default的里面添加data并把它return出來

而在vue3中，新增了個(gè)函數(shù)setup，

vue2中的聲明周期都是寫在data外面的，和data同級，但是vue3的生命周期是寫在setup函數(shù)里面的

3.綁定事件

vue3中的綁定事件和建立數(shù)據(jù)差不多

Vue2和Vue3的區(qū)別

vue2 的雙向數(shù)據(jù)綁定是利用 ES5 的一個(gè)API Object.definePropert() 對數(shù)據(jù)進(jìn)行劫持，結(jié)合發(fā)布訂閱模式的方式來實(shí)現(xiàn)的。

vue3 中使用了 ES6 的 Proxy API對數(shù)據(jù)代理。

相比 vue2.x ，使用 proxy 的優(yōu)勢如下：

在 vue2 中定義數(shù)據(jù)變量是 data(){} ，創(chuàng)建的方法要在 methods:{} 中。

而在 vue3 中直接在 setup(){} 中，在這里面定義的變量和方法因?yàn)樽罱K要在模板中使用，所以最后都得 return 。

如：

除了這些鉤子函數(shù)外， Vue3.x 還增加了 onRenderTracked 和 onRenderTriggered 函數(shù)。

這篇文章持續(xù)更新喲

vue-cli2版本跟3版本中的區(qū)別

2.x版本目錄

3.x版本

vue-cli3是沒有static文件夾

原來放在static下的文件，現(xiàn)在應(yīng)該放在public文件夾下

2.x寫法

3.x寫法

如果json文件里有圖片路徑里不用加 public

img src="../../public/img/details06_3.png" alt=""

改為

img src="../../img/details06_3.png" alt=""

關(guān)于vue版本2和3怎么看和vuecli查看版本的介紹到此就結(jié)束了，不知道你從中找到你需要的信息了嗎 ？如果你還想了解更多這方面的信息，記得收藏關(guān)注本站。