Vue3.0和Vue2.0的區別

https://www.cnblogs.com/zdz8207/p/vue-3-2.html

vue3.0和2.0的區別
Vue-cli3.0於 8月11日正式發佈,看了下評論,兼容性不是很好,命令有不少變化,不是特別的樂觀
vue3.0 的發佈與 vue2.0 相比,優勢主要體現在:更快、更小、更易維護、更易於原生、讓開發者更輕鬆;
更快
  1、virtual DOM 完全重寫,mounting & patching 提速 100%;
  2、更多編譯時 (compile-time)提醒以減少 runtime 開銷;
  3、基於 Proxy 觀察者機制以滿足全語言覆蓋以及更好的性能;
  4、放棄 Object.defineProperty ,使用更快的原生 Proxy;
  5、組件實例初始化速度提高 100%;
  6、提速一倍/內存使用降低一半;

更小
  1、Tree-shaking 更友好;
  2、新的 core runtime:~ 10kb gzipped;
===============
3.0 新加入了 TypeScript 以及 PWA 的支持
部分命令發生了變化:
下載安裝  npm install -g vue@cli
刪除了vue list
創建項目   vue create
啓動項目   npm run serve
默認項目目錄結構也發生了變化:
移除了配置文件目錄,config 和 build 文件夾
移除了 static 文件夾,新增 public 文件夾,並且 index.html 移動到 public 中
在 src 文件夾中新增了 views 文件夾,用於分類 視圖組件 和 公共組件 
  
安裝
npm install -g vue@cli
創建項目文件:
vue create project //項目的名稱

====================
vue2和vue3的區別
一、常用命令
vue -V 查看本地 vue 版本

二、官方文檔
3.0:https://cli.vuejs.org/zh/

三、創建文件
3.0:vue create 進入工程文件夾,創建項目。
2.0:vue init webpack

四、啓動項目
3.0啓動npm run serve
2.0啓動npm run dev

build沒了、config沒了、哦對了還有最重要的一點,3.0的安裝項目時自動下載node-model。

在根目錄下創建一個vue.config.js
module.exports = {
baseUrl: process.env.NODE_ENV === 'production' ? '/online/' : '/',
// outputDir: 在npm run build時 生成文件的目錄 type:string, default:'dist'
// outputDir: 'dist',
// pages:{ type:Object,Default:undfind }
devServer: {
port: 8888, // 端口號
host: 'localhost',
https: false, // https:{type:Boolean}
open: true, //配置自動啓動瀏覽器
// proxy: 'http://localhost:4000' // 配置跨域處理,只有一個代理
proxy: {
'/api': {
target: '<url>',
ws: true,
changeOrigin: true
},
'/foo': {
target: '<other_url>'
}
}, // 配置多個代理
}
}

==================
Vue3.0和Vue2.0的區別

一、默認進行懶觀察(lazy observation)。
在 2.x 版本里,不過數據多大,都會在一開始就爲其創建觀察者。當數據很大時,這可能會在頁面載入時造成明顯的性能壓力。3.x 版本,只會對「被用於渲染初始可見部分的數據」創建觀察者,而且 3.x 的觀察者更高效。

二、更精準的變更通知。
比例來說:2.x 版本中,你使用 Vue.set 來給對象新增一個屬性時,這個對象的所有 watcher 都會重新運行;3.x 版本中,只有依賴那個屬性的 watcher 纔會重新運行。

三、3.0 新加入了 TypeScript 以及 PWA 的支持

四、部分命令發生了變化:
下載安裝 npm install -g vue@cli
刪除了vue list
創建項目 vue create
啓動項目 npm run serve

五、默認項目目錄結構也發生了變化:
移除了配置文件目錄,config 和 build 文件夾
移除了 static 文件夾,新增 public 文件夾,並且 index.html 移動到 public 中
在 src 文件夾中新增了 views 文件夾,用於分類 視圖組件 和 公共組件

發佈了58 篇原創文章 · 獲贊 44 · 訪問量 7萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章