如何實(shí)現(xiàn)ts+vuecli4重構(gòu)項(xiàng)目-創(chuàng)新互聯(lián)

這篇文章主要講解了如何實(shí)現(xiàn)ts+vuecli4重構(gòu)項(xiàng)目，內(nèi)容清晰明了，對(duì)此有興趣的小伙伴可以學(xué)習(xí)一下，相信大家閱讀完之后會(huì)有幫助。

10年積累的網(wǎng)站設(shè)計(jì)、成都網(wǎng)站制作經(jīng)驗(yàn)，可以快速應(yīng)對(duì)客戶(hù)對(duì)網(wǎng)站的新想法和需求。提供各種問(wèn)題對(duì)應(yīng)的解決方案。讓選擇我們的客戶(hù)得到更好、更有力的網(wǎng)絡(luò)服務(wù)。我雖然不認(rèn)識(shí)你，你也不認(rèn)識(shí)我。但先網(wǎng)站策劃后付款的網(wǎng)站建設(shè)流程，更有潞城免費(fèi)網(wǎng)站建設(shè)讓你可以放心的選擇與我們合作。

項(xiàng)目背景：

一個(gè)以前的項(xiàng)目（ 剛?cè)肼殞?shí)習(xí)的時(shí)候?qū)懙?，用的vuecli2 ），然后這次要添加修改東西，看著代碼看的頭大，沖動(dòng)之下就重構(gòu)了（ 想打死自己，寫(xiě)的啥玩意 ），剛好用下最近剛學(xué)的typescript,從搭建開(kāi)始，一步步更新記錄下，怕自己之后忘了再回過(guò)頭來(lái)看看。（ 順便說(shuō)一句，用起來(lái)有點(diǎn)別扭，不過(guò)還是挺爽的，期待vue3.0... ）

一.項(xiàng)目搭建：

使用命令   vue create news 創(chuàng)建項(xiàng)目

配置自定義，貼一下我自定義的安裝依賴(lài)   

ts+vuex+router這幾個(gè)肯定是要的，這里的css我選擇的是scss，unit測(cè)試也來(lái)一個(gè)

之后一些的選項(xiàng)就自己選擇

3. 搭建好后目錄就是這樣

├── public             // 靜態(tài)頁(yè)面

├── src               // 主目錄

  ├── assets           // 靜態(tài)資源

  ├── components         // 組件

  ├── views            // 頁(yè)面

  ├── App.vue           // 頁(yè)面主入口

  ├── main.ts           // 腳本主入口

  ├── router.ts          // 路由

  ├── shims-tsx.d.ts       // 相關(guān) tsx 模塊注入

  ├── shims-vue.d.ts       // Vue 模塊注入

  └── store.ts          // vuex 配置

├── tests              // 測(cè)試用例

├── .eslintrc.js          // eslint 相關(guān)配置

├── .gitignore           // git 忽略文件配置

├── babel.config.js         // babel 配置

├── postcss.config.js        // postcss 配置

├── package.json          // 依賴(lài)

└── tsconfig.json          // ts 配置

本文名稱(chēng)：如何實(shí)現(xiàn)ts+vuecli4重構(gòu)項(xiàng)目-創(chuàng)新互聯(lián)
當(dāng)前網(wǎng)址：http://m.jiaotiyi.com/article/dgsojp.html