{"id":555169,"date":"2022-02-20T00:05:40","date_gmt":"2022-02-19T16:05:40","guid":{"rendered":"http:\/\/4563.org\/?p=555169"},"modified":"2022-02-20T00:05:40","modified_gmt":"2022-02-19T16:05:40","slug":"vitereacttseslintprettier-starter-kit-5","status":"publish","type":"post","link":"http:\/\/4563.org\/?p=555169","title":{"rendered":"Vite+React+TS+Eslint+Prettier starter kit"},"content":{"rendered":"
\n
\n
\n

Vite+React+TS+Eslint+Prettier starter kit <\/h1>\n

<\/p>\n

\n
\u8cc7\u6df1\u5927\u4f6c : XTTX <\/span> <\/i> 44<\/span> <\/div>\n
<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n
Vite \u7528 es-build, \u901f\u5ea6\u5c31\u4e0d\u7528\u591a\u8bb2\u4e86\u3002\u5bf9\u6bd4 CRA, \u597d\u591a\u5730\u65b9\u6709\u4e0d\u540c\u3002 \u6211\u82b1\u4e86\u4e0d\u5c11\u65f6\u95f4\uff0c\u641c\u4e86\u4e0d\u5c11\u4e1c\u897f\uff0c\u505a\u4e86\u4e00\u4e2a\u81ea\u5df1\u7528\u7684 starter kit.
Vite + React + Typescript + Eslint + Airbnb eslint rules + Airbnb Typescript rules + Prettier + env variable import + Absolute Import Path
https:\/\/github.com\/jt6677\/vite_ts_eslint_prettier_aribnbts
==============================================
!yes, tons of setup and config files.
==============================================
env variable import:
You need to add type in env.d.ts like “readonly VITE_ANYTHING: string”
variables MUST start with VITE_
usage of env variable in your app, no need to import, just use it as a global variable: console.log(import.meta.env.VITE_API_URL)
==============================================
Absolute Import Path
import App from “~\/components”. ~\/ is the absoulte path, equal to .\/src
==============================================
reverse Proxy in vite.config.ts <\/div>\n
\u5927\u4f6c\u6709\u8a71\u8aaa<\/b> (1<\/span>) <\/div>\n
<\/div>\n<\/p><\/div>\n<\/p><\/div>\n
    \n
  • \n
    \n
    \n
    \u4e3b<\/span> \u8cc7\u6df1\u5927\u4f6c : XTTX <\/span> <\/div>\n
    <\/i> <\/span> <\/div>\n<\/p><\/div>\n
    Vite + React + Typescript + Eslint + Airbnb eslint rules + Airbnb Typescript rules + Prettier + env variable import + Absolute Import Path
    !yes, tons of setup and config files.
    ==============================================
    env variable import:
    You need to add type in env.d.ts like “readonly VITE_ANYTHING: string”
    variables MUST start with VITE_
    usage of env variable in your app, no need to import, just use it as a global variable: console.log(import.meta.env.VITE_API_URL)
    ==============================================
    Absolute Import Path
    import App from “~\/components”. ~\/ is the absoulte path, equal to .\/src
    ==============================================
    reverse Proxy in vite.config.ts <\/div>\n<\/p><\/div>\n<\/li>\n
  • \n","protected":false},"excerpt":{"rendered":"

    Vite+React+TS+Esl…<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[],"tags":[],"_links":{"self":[{"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/posts\/555169"}],"collection":[{"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=555169"}],"version-history":[{"count":0,"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/posts\/555169\/revisions"}],"wp:attachment":[{"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=555169"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=555169"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=555169"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}