原创 Vue核心概念及特性 (一)

Vue (讀音 /vjuː/,類似於 view) 是一套用於構建用戶界面的漸進式框架。 特點: 易用,靈活,高效,漸進式框架。 可以隨意組合需要用到的模塊 vue + components + vue-router + vuex + vu

原创 快速進階Vue3.0

在2019.10.5日發佈了Vue3.0預覽版源碼,但是預計最早需要等到 2020 年第一季度纔有可能發佈 3.0 正式版。 可以直接看 github源碼。 新版Vue 3.0計劃並已實現的主要架構改進和新功能: 編譯器(Compile

原创 從0搭建自己的webpack開發環境(五)

往期回顧:從0搭建自己的webpack開發環境(一) 從0搭建自己的webpack開發環境(二) 從0搭建自己的webpack開發環境(三) 從0搭建自己的webpack開發環境(四) 前四篇文章我們已經掌握了webpack各種常見的配置,

原创 從0搭建自己的webpack開發環境(四)

往期回顧:從0搭建自己的webpack開發環境(一)從0搭建自己的webpack開發環境(二)從0搭建自己的webpack開發環境(三) 經過三期的學習,本篇文章將介紹TS和React/Vue的結合使用,搭載Webpack,助力成長前端高級

原创 從0搭建自己的webpack開發環境(三)

往期回顧: 從0搭建自己的webpack開發環境(一) 從0搭建自己的webpack開發環境(二) 1.處理JS模塊 1.1 將es6代碼編譯成es5代碼 代碼的轉化工作要交給babel來處理 npm install @babel/core

原创 從0搭建自己的webpack開發環境(二)

上期回顧:從0搭建自己的webpack開發環境(一) loader主要是用於把模塊原內容按照需求轉換成新內容,以便用來加載非 JS 模塊! 通過使用不同的loader,Webpack可以把不同的文件都轉成JS文件,比如CSS、ES6/7

原创 從0搭建自己的webpack開發環境(一)

上期文章:前端自動化測試 又一個連載來啦!這次我們將分四篇文章來介紹如何從0構建一個webpack開發環境,瞭解其內部機制和原理,從而讓我們更準確的掌握和使用webpack,下面開始我們的起步: 1.什麼是Webpack? webpack是

原创 前端自動化測試(四)

在Vue項目中測試組件時會引用全局組件,那麼如何處理這些全局組件呢? 還有Vue中比較重要的一個點就是Vuex如何進行測試? 1.測試時使用VueRouter 1.1 存根 在你的組件中引用了全局組件 router-link 或者 rout

原创 前端自動化測試(二)

上一篇文章,我們已經講述了Jest中的基本使用,這一篇我們來說說如何深度使用Jest 在測試中我們會遇到很多問題,像如何測試異步邏輯,如何mock接口數據等... 通過這一篇文章,可以讓你在開發中對Jest的應用遊刃有餘,讓我們逐一擊破各個

原创 前端自動化測試(一)

目前開發大型應用,測試是一個非常重要的環節,但是大多數前端開發者對測試相關的知識是比較缺乏的。因爲可能項目開發週期短根本沒有機會寫,所以你沒有辦法體會到前端自動化測試的重要性。 來說說爲什麼前端自動化測試如此重要! 先看看前端常見的問題:

原创 new原理及模擬實現

簡介new new 運算符是創建一個用戶定義的對象類型的實例或具有構造函數的內置對象的實例,其創建過程如下: 創建一個空的簡單JavaScript對象(即{}) 鏈接該對象(即設置該對象的構造函數)到另一個對象 將第一步新創建的對象作爲t

原创 從原型到原型鏈

構造函數 function Animal() { } var cat = new Animal(); cat.name = 'Tom'; console.log(cat.name) // Tom prototype 每個函數都有一個 pr

原创 JSX在render函數中的應用

一.JSX簡介 const element = <h1>Hello, world!</h1>; JSX 可以很好地描述 UI 應該呈現出它應有交互的本質形式。JSX 可能會使人聯想到模版語言,但它具有 JavaScript 的全部功能。 B

原创 關於NPM你必須要知道的常用命令

npm:全稱node package mananger,是世界上最大規模的包管理系統,官網是這樣介紹的 Build amazing things... 那咱們就來看看他做了哪些驚人的事~ 一.npm init 默認大家肯定比較熟悉了,直接

原创 手擼一個自己的前端腳手架

手擼一個自己的前端腳手架 很多小夥伴一直很糾結什麼是腳手架?其實核心功能就是創建項目初始文件,那問題又來了,市面上的腳手架不夠用嗎,爲什麼還要自己寫? 只要提到腳手架你就會想到,vue-cli 、 create-react-app 、 dv