新聞中心
這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
如何實(shí)現(xiàn)ts+vuecli4重構(gòu)項(xiàng)目-創(chuàng)新互聯(lián)
這篇文章主要講解了如何實(shí)現(xiàn)ts+vuecli4重構(gòu)項(xiàng)目,內(nèi)容清晰明了,對此有興趣的小伙伴可以學(xué)習(xí)一下,相信大家閱讀完之后會有幫助。
項(xiàng)目背景:
一個(gè)以前的項(xiàng)目( 剛?cè)肼殞?shí)習(xí)的時(shí)候?qū)懙模玫膙uecli2 ),然后這次要添加修改東西,看著代碼看的頭大,沖動之下就重構(gòu)了( 想打死自己,寫的啥玩意 ),剛好用下最近剛學(xué)的typescript,從搭建開始,一步步更新記錄下,怕自己之后忘了再回過頭來看看。( 順便說一句,用起來有點(diǎn)別扭,不過還是挺爽的,期待vue3.0... )
一.項(xiàng)目搭建:
使用命令 vue create news 創(chuàng)建項(xiàng)目
配置自定義,貼一下我自定義的安裝依賴
ts+vuex+router這幾個(gè)肯定是要的,這里的css我選擇的是scss,unit測試也來一個(gè)
之后一些的選項(xiàng)就自己選擇
3. 搭建好后目錄就是這樣
├── public // 靜態(tài)頁面 ├── src // 主目錄 ├── assets // 靜態(tài)資源 ├── components // 組件 ├── views // 頁面 ├── App.vue // 頁面主入口 ├── main.ts // 腳本主入口 ├── router.ts // 路由 ├── shims-tsx.d.ts // 相關(guān) tsx 模塊注入 ├── shims-vue.d.ts // Vue 模塊注入 └── store.ts // vuex 配置 ├── tests // 測試用例 ├── .eslintrc.js // eslint 相關(guān)配置 ├── .gitignore // git 忽略文件配置 ├── babel.config.js // babel 配置 ├── postcss.config.js // postcss 配置 ├── package.json // 依賴 └── tsconfig.json // ts 配置
當(dāng)前題目:如何實(shí)現(xiàn)ts+vuecli4重構(gòu)項(xiàng)目-創(chuàng)新互聯(lián)
瀏覽地址:http://www.dlmjj.cn/article/dgsojp.html