From 551793c03642f517f94a87d9c4f4d837ebb9acf5 Mon Sep 17 00:00:00 2001 From: haishan <710328466@qq.com> Date: Wed, 25 May 2022 12:33:54 +0800 Subject: [PATCH] feat: next --- .babelrc | 12 ++++ .env | 2 + .env.pre | 3 + .env.prod | 3 + .env.release | 3 + .env.test | 3 + .eslintrc.js | 4 ++ .gitignore | 34 +++++++++++ .vscode/settings.json | 40 +++++++++++++ README.md | 35 +---------- next-env.d.ts | 2 + next-less.config.js | 67 +++++++++++++++++++++ next.config.js | 61 +++++++++++++++++++ package.json | 58 ++++++++++++++++++ public/favicon.ico | Bin 0 -> 67646 bytes src/assets/data/code.json | 0 src/components/Demo/index.less | 3 + src/components/Demo/index.tsx | 15 +++++ src/components/PageHeader/index.tsx | 22 +++++++ src/interfaces/base.ts | 8 +++ src/layouts/BasicLayout/index.tsx | 14 +++++ src/pages/_app.tsx | 7 +++ src/pages/api/hello.ts | 6 ++ src/pages/index.tsx | 11 ++++ src/services/index.ts | 16 +++++ src/styles/antd-custom.less | 0 src/styles/var.less | 90 ++++++++++++++++++++++++++++ src/utils/clientRequest.ts | 50 ++++++++++++++++ src/utils/serverRequest.ts | 21 +++++++ tsconfig.json | 24 ++++++++ typings.d.ts | 3 + 31 files changed, 583 insertions(+), 34 deletions(-) create mode 100644 .babelrc create mode 100644 .env create mode 100644 .env.pre create mode 100644 .env.prod create mode 100644 .env.release create mode 100644 .env.test create mode 100644 .eslintrc.js create mode 100644 .gitignore create mode 100644 .vscode/settings.json create mode 100644 next-env.d.ts create mode 100644 next-less.config.js create mode 100644 next.config.js create mode 100644 package.json create mode 100644 public/favicon.ico create mode 100644 src/assets/data/code.json create mode 100644 src/components/Demo/index.less create mode 100644 src/components/Demo/index.tsx create mode 100644 src/components/PageHeader/index.tsx create mode 100644 src/interfaces/base.ts create mode 100644 src/layouts/BasicLayout/index.tsx create mode 100644 src/pages/_app.tsx create mode 100644 src/pages/api/hello.ts create mode 100644 src/pages/index.tsx create mode 100644 src/services/index.ts create mode 100644 src/styles/antd-custom.less create mode 100644 src/styles/var.less create mode 100644 src/utils/clientRequest.ts create mode 100644 src/utils/serverRequest.ts create mode 100644 tsconfig.json create mode 100644 typings.d.ts diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..04b7e1d --- /dev/null +++ b/.babelrc @@ -0,0 +1,12 @@ +{ + "presets": ["next/babel"], + "plugins": [ + [ + "import", + { + "libraryName": "antd", + "style": true + } + ] + ] +} diff --git a/.env b/.env new file mode 100644 index 0000000..1fe569f --- /dev/null +++ b/.env @@ -0,0 +1,2 @@ +NODE_ENV=development +CLIENT_BASE_API=/api \ No newline at end of file diff --git a/.env.pre b/.env.pre new file mode 100644 index 0000000..2132d13 --- /dev/null +++ b/.env.pre @@ -0,0 +1,3 @@ +NODE_ENV=production +CLIENT_BASE_API=/api +TTT=pre \ No newline at end of file diff --git a/.env.prod b/.env.prod new file mode 100644 index 0000000..6c80a77 --- /dev/null +++ b/.env.prod @@ -0,0 +1,3 @@ +NODE_ENV=production +CLIENT_BASE_API=/api +TTT=production \ No newline at end of file diff --git a/.env.release b/.env.release new file mode 100644 index 0000000..45869d1 --- /dev/null +++ b/.env.release @@ -0,0 +1,3 @@ +NODE_ENV=production +CLIENT_BASE_API=/api +TTT=release \ No newline at end of file diff --git a/.env.test b/.env.test new file mode 100644 index 0000000..c66c594 --- /dev/null +++ b/.env.test @@ -0,0 +1,3 @@ +NODE_ENV=production +CLIENT_BASE_API=/api +TTT=test \ No newline at end of file diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..61dde3a --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,4 @@ +module.exports = { + extends: [], + rules: {}, +}; diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..1437c53 --- /dev/null +++ b/.gitignore @@ -0,0 +1,34 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js + +# testing +/coverage + +# next.js +/.next/ +/out/ + +# production +/build + +# misc +.DS_Store +*.pem + +# debug +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# local env files +.env.local +.env.development.local +.env.test.local +.env.production.local + +# vercel +.vercel diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..37ad7a2 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,40 @@ +{ + "editor.codeActionsOnSave": { + "source.fixAll.eslint": true + }, + "eslint.validate": [ + "javascript", + "react", + "typescript", + "typescriptreact", + "vue" + ], + "editor.formatOnSave": true, + "[typescriptreact]": { + "editor.defaultFormatter": null + }, + "[javascript]": { + "editor.defaultFormatter": null + }, + "[typescript]": { + "editor.defaultFormatter": null + }, + "[javascriptreact]": { + "editor.defaultFormatter": null + }, + "[json]": { + "editor.defaultFormatter": "esbenp.prettier-vscode" + }, + "[less]": { + "editor.defaultFormatter": "esbenp.prettier-vscode" + }, + "[scss]": { + "editor.defaultFormatter": "esbenp.prettier-vscode" + }, + "[css]": { + "editor.defaultFormatter": "esbenp.prettier-vscode" + }, + "[jsonc]": { + "editor.defaultFormatter": "esbenp.prettier-vscode" + } +} diff --git a/README.md b/README.md index 161ddb4..d539424 100644 --- a/README.md +++ b/README.md @@ -1,34 +1 @@ -## 目前已有脚手架列表 - -| 名称 | 说明 | 技术栈 | -| ------- | --------------------------- | --------------------- | -| nextJs | 基于 React 的服务端渲染方案 | nextJs + axios + antd | -| ReactJs | 基于 React 的业务型脚手架 | umiJs + axios + antd | -| TaroJs | 基于 React 的多端适配方案 | TaroJs 全家桶 | -| Vue | 基于 Vue 的业务型脚手架 | vueJs 全家桶 | -| Gulp | 基于 Gulp 的清凉型脚手架 | -- | - -## 快速上手 - -### 1. 安装相关依赖 - -```js -// 推荐 -yarn global add @nicecode/cli - -// or -// npm install @nicecode/cli -g -``` - -### 2. 运行命令 - -```js -// 查看脚手架版本号，是否安装成功 -nice - V -``` - -### 3. 创建项目 - -```js -nice create ${项目名称} -``` +# nextjs-template \ No newline at end of file diff --git a/next-env.d.ts b/next-env.d.ts new file mode 100644 index 0000000..7b7aa2c --- /dev/null +++ b/next-env.d.ts @@ -0,0 +1,2 @@ +/// +/// diff --git a/next-less.config.js b/next-less.config.js new file mode 100644 index 0000000..92ef1ea --- /dev/null +++ b/next-less.config.js @@ -0,0 +1,67 @@ +const cssLoaderConfig = require('@zeit/next-css/css-loader-config'); + +module.exports = (nextConfig = {}) => { + return Object.assign({}, nextConfig, { + webpack(config, options) { + if (!options.defaultLoaders) { + throw new Error( + 'This plugin is not compatible with Next.js versions below 5.0.0 https://err.sh/next-plugins/upgrade', + ); + } + + const { dev, isServer } = options; + const { + cssModules, + cssLoaderOptions, + postcssLoaderOptions, + lessLoaderOptions = {}, + } = nextConfig; + + options.defaultLoaders.less = cssLoaderConfig(config, { + extensions: ['less'], + cssModules, + cssLoaderOptions, + postcssLoaderOptions, + dev, + isServer, + loaders: [ + { + loader: 'less-loader', + options: lessLoaderOptions, + }, + ], + }); + + config.module.rules.push({ + test: /\.less$/, + exclude: /node_modules/, + use: options.defaultLoaders.less, + }); + + // 我们禁用了antd的cssModules + config.module.rules.push({ + test: /\.less$/, + include: /node_modules/, + use: cssLoaderConfig(config, { + extensions: ['less'], + cssModules: false, + cssLoaderOptions: {}, + dev, + isServer, + loaders: [ + { + loader: 'less-loader', + options: lessLoaderOptions, + }, + ], + }), + }); + + if (typeof nextConfig.webpack === 'function') { + return nextConfig.webpack(config, options); + } + + return config; + }, + }); +}; diff --git a/next.config.js b/next.config.js new file mode 100644 index 0000000..14b6bde --- /dev/null +++ b/next.config.js @@ -0,0 +1,61 @@ +const withCSS = require('@zeit/next-css'); +const withLessExcludeAntd = require('./next-less.config'); +const lessToJS = require('less-vars-to-js'); +const fs = require('fs'); +const path = require('path'); + +// Where your antd-custom.less file lives +const modifyVars = lessToJS( + fs.readFileSync( + path.resolve(__dirname, './src/styles/antd-custom.less'), + 'utf8', + ), +); + +require('dotenv').config(); + +module.exports = withLessExcludeAntd( + withCSS({ + cssModules: true, + cssLoaderOptions: { + importLoaders: 1, + localIdentName: '[local]___[hash:base64:5]', + }, + lessLoaderOptions: { + javascriptEnabled: true, + modifyVars, // make your antd custom effective + }, + webpack: (config, { isServer }) => { + if (isServer) { + const antStyles = /antd\/.*?\/style.*?/; + const origExternals = [...config.externals]; + config.externals = [ + (context, request, callback) => { + if (request.match(antStyles)) return callback(); + if (typeof origExternals[0] === 'function') { + origExternals[0](context, request, callback); + } else { + callback(); + } + }, + ...(typeof origExternals[0] === 'function' ? [] : origExternals), + ]; + + config.module.rules.unshift({ + test: antStyles, + use: 'null-loader', + }); + } + // 别名 + config.resolve.alias['@'] = path.resolve(__dirname, './src'); + config.resolve.alias['@static'] = path.resolve(__dirname, './static'); + return config; + }, + env: { + CLIENT_BASE_API: process.env.CLIENT_BASE_API, + }, + // 用上面的方式使用a[b]的取值取不到 + publicRuntimeConfig: { + }, + }), +); diff --git a/package.json b/package.json new file mode 100644 index 0000000..dbd98ca --- /dev/null +++ b/package.json @@ -0,0 +1,58 @@ +{ + "name": "nextjs-template", + "version": "1.0.0", + "private": true, + "scripts": { + "dev": "next dev", + "build": "dotenv -e .env next build", + "build:test": "dotenv -e .env.test next build", + "build:release": "dotenv -e .env.release next build", + "build:pre": "dotenv -e .env.pre next build", + "build:production": "dotenv -e .env.prod next build", + "start": "next start", + "lint": "eslint 'src/**/*.{js,jsx,tsx,ts}'", + "lint:fix": "eslint 'src/**/*.{js,jsx,tsx,ts}' --fix", + "prettier": "prettier --write 'src/**/*.{less,css,md,json}'" + }, + "dependencies": { + "antd": "^100.0.1", + "axios": "^0.21.1", + "next": "10.0.4", + "normalize.css": "^8.0.1", + "react": "17.0.1", + "react-dom": "17.0.1" + }, + "devDependencies": { + "@types/node": "^14.14.19", + "@types/react": "^17.0.0", + "@types/react-dom": "^17.0.0", + "@types/styled-components": "^5.1.7", + "@zeit/next-css": "^1.0.1", + "@zeit/next-less": "^1.0.1", + "babel-plugin-import": "^1.13.3", + "css-loader": "^5.0.1", + "dotenv": "^8.2.0", + "dotenv-cli": "^4.0.0", + "eslint": "^7.32.0", + "less": "3.13.1", + "less-vars-to-js": "^1.3.0", + "lint-staged": "^11.1.2", + "null-loader": "^4.0.1", + "prettier": "^2.3.2", + "typescript": "^4.4.2", + "yorkie": "^2.0.0" + }, + "gitHooks": { + "pre-commit": "tsc --noEmit && lint-staged" + }, + "lint-staged": { + "*.{js,jsx,ts,tsx}": [ + "npm run lint:fix", + "git add ." + ], + "*.{less,css,md,json}": [ + "npm run prettier", + "git add ." + ] + } +} diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..fb0271bd934f046de8f7ee055c31faf6bcd81026 GIT binary patch literal 67646 zcmeHQ32;=$nI02LW(kp1EXyi{vI%AhcAOx|G6)coIE;iqAcSs>?px@VkOdY(;xu<~ z4y=_iaV4zFPziQil-KbR8DFd`_PSCrOHr;3Hew`=M%Uak7UJLUf0`#h4I?nvPV|@_ z>ZiN^?$__{@9)?B_uu`VG@ASHuc=9c|7U6DO}bArU8B*=1A)a%iO*3fF&q*93j_oL z0s(=5KtLcM5D*9m1Ox&C0fB%(Kp-Fx5C{ka1Ofs9fq+0jARrJB2nYlO0s;YnfIvVX zAP^7;2m}NI0s(=5KtLcM5D*9m1Ox&C0fB%(Kp-FxP!$3%yzs&VRS7JF{YDXZ=9y>S z`9>=gmHpii*tc(=-{HfDeUvwBYirXSIB>vE$-7mY^-n|^)bo|ExmA54@0&#c`Z@1j zBlJEQ{MSGyn2=t~Wey%Z$ozLe$H8kw_?r8*?rD^{2zm*026R-JkF+o7raHje3ObK_ z3^@B7U9=N06Orb{};jkIq=@h)*|5KD>TY;bbGh7e<5RV0~#Zw*NiRXV9rf>cKLx&Fe@$(7H=RhYTYjyMi zAMoZu_mh-Dpu7+I!Cd4`1>IKvDC>uMxvse_EiEJUgEs}d>71{upX1;Q{kwxQ&eG5k zj|C^bj#%hh+=qUrtONaGFL>`Ej8O8?Pqg5jMP9v-NU$f#*tKsRNOVh7i6C{>b_oc!z-Z7gxSqt{>?});Ir3N=hbh z8e~+IYezjfQUUx2{!4Nm>XiKXNMDe7(5J^f#n+>rFqHcM#PZ29m=QmYx+GZk^RMZ!YsSLjR1w z@DG^90v~=pUPU~Bxrp<#EASC8`NrH$U|6*a5nnn1eOiykukuPR_b4tM{bL>7wNj^$e4iZ+{gdV zxr{fA|J+XZA29t0Gzv4MPsluk+&@l(wxVCmnhXfDl=4GUOwXIcbALPC>H@@S>$m=zNZl~Oafo2f2E!9p0YlayOsW((EW7u3uRq5 z?R6{byO-j?MyY>!ZkM0YkC8tU#CG1Rpcd9Ww;%DdAl3)t&N||JSwFvYl~L-S=L@Bc zpt}{0DBGf_Pp+3kt|P)#zfxzff&ZrK8kQ+ft{?GR>7VOl+tvV*?{iYV_FfOs=9~17 zXMxuUN<3s-M)q-BV}OjeoX_ElAZbmBP}V==`x}t5oMfAM!k5Qrx3Vnb0njQut0QX$ zq?P(V1DX85ljk$;1JcjOT|H7wg4&i9rd+U!yP|H$@32h$*z zZ0lJOZv(OJqPn{{d%~v<<4uI0S0Y|#jWa@)|>yy|A!w#4d1e z1IkR0%gO#r_c9_a5D*9m1Ox&C0fB%(Kp-Fx5C{ka1Ofs9fq+0jAaHjG;FAuTKmO4< zhfA_C{ZIAft$28{I!@IkixN1BhaOo0F*}L1cH$S__kg&dk zVpr>EeUy&k)^<{ALibQr*}(t(;%Am>tCdFi^~O^hge-T5KxZdS+|^`hO^!3ry2vhC z9o|VR7wBkZa0f*$?xeLVx+rdSH)W>w(~*7lBYM5)19yk?_`K@CURyy*eD6?9q@I=s z=_qL0RSNj-=Mn|_w$q{?>L@m<2V+4GWu^@b9Xn=kAZi+)jS*7a5d#1D2j{f>EVDj# zO%JVovYQsnXs7w#y-M@{$wiafDSB}aWuzJ@C83`ZV*6=RvDN(UJA+=e_kKs9s;Kbc z!!~VFypiH!dMPcrpE5FxwD1QVG=K6n^n+oFi|VJ+avSC6StuE0(~>RJ+UhJ(Q8R_8 z9uQ!AzizYR=l$ta^xmhNvsI*Z`cn<~m>L}oQItujbpyZ84s&8;mO^uy$vd{;R zZro;no#@oK+k^JdOu-rh0ix{_sw-@7#6$m?X(lS&WTpD29ni6vo($=cbiZ;z52dG? zs2tD#wq^$v71)T!i?R}%;lmHEPaC6Z!BznRM2}9WskEPtUq1lb-b|ZHY*bTcr`&8a z?0y5D{|;LGLp`M?ny9$YN)1g8^bs4z3KL~%%|j=DGq_v@%@iWu0)c(IoOOwDW=cym zQelCWDynUin`x%#rFj0QU@h=~j^bkms36xuPi?VNE&4}>7Uj_gcJFdF+@flcr2+(6 zpEEB`OEM27#_{}bp^7Ry73P^~v_@L?sGb5R>*xvp z4rzWUDzLx?a7wly+XPu!%h1mbJ4W8!8~?2p5_&>lM}xCDDGvUf_yO4Wm;8478kM&FhC^*_TF=^lk_cF zuLV%$4JW!Xp{BzA#>RF1l(Yf9UdaZqz~&pE@JG6&Ibgx}JFpKtJU?vN=761GhacET z+GH~w|M$UIl|$h5;_qp8HY8yUxFNES3JT0rhA|)qdjV0QumLds^E|+7Lbd^FHp5TE zHbA-=HiMCNHan$v$h{s!6$5ah#S)g5Y#NGLfjwU6y`ly-K(1M``+^>T4G24MHSED` z*Z^f^HmcudN4|x)&s3G!E<5PTWED5x>qYDcJzUuno2~!w&!(AO(IP_>JtZyfPT<^&qMk0HX8>wPm(*@iG0hc3BT? z!d_5WnUylq2PooE_<`{JKQUb=*#PVx+=BhU@^U-oe-mkw%(Q=xtyIO$7or1!-Hnb$ zex9Qi87L2XK$UC*WE*J>Y=HS#0|a0mh=UEl`$M&`0XEm!C>u6Fa=eKew>pl~hXn#h z6(jI`t0PRCWE|wRKF{mr@b?!Km|z3+(&K)79^jg^FPNPUKOx4325Bztxs{5s-cQ9|z!U!p{bLQV^hfXmVBJ>& z8-V=)CB;@sgZ}ffEQ4oGTRnbvMpYnqv9LrRYBpC|Ur&G!U|FD^3Jb9gL?6h6Pbh32 zY=G~zQ!x5L^2UB?kC4v zEKpQ00v9imZ%KjeQe1Q|h0X1x0?hO2Dg6|)%z%Ah>;+A^iZfvyloZ>CIUnnQdOKB1 z`+?Xmz&dcx4tuM5TQ4NI&y2qW=-^h^e?M)l}MA6E_S{B>Vs=I2Tx22^$}4fMxS> z9t3_MUI)Z1?~(Qgc&~`hg%;s_DDMRn=31?1UlTTfiq)@aZnSGt6HK%+sGGvD-Ydkp zuhfJ-3Yj^)55(^VEXP>D`-AKYetNr8Iyc0=z>HKYwfxGqPR;H2cG+M0Ej`9I;M%Yr zTJ&Hi-uuIz0OtG9xg8YzFMJ-T9en}&!59+?^UbswHb7~qh4%rZv*J6N?5$!MsNP;g zbk(OM-*Sn4y{v!U6Uv1jI1TUrE&D0v0QdodrVgJ8%fmUbO3V)x@COzbS*3SHsw?c5 z|MoW;^*3hKi-vbfzNN<6k`&i3jsLtKl$~jUPoM+-zYYpw{bLMR9oh~5KkNh80DLa2 z48A~K3*zkH(CJfRKTyp*=g0wP4*P#r1a?t4_I)=-^XY*}!YC`Pmn2lFkKJSv2?iimL*|FV*_k-2idLcI>uw}FD z81DmzVf+t+?XQLXr%mdo24rFTVm+)qYdSr-AH0nUk*mskz|{kBc| z`!fPfbs}(JuOm7m#WckJ{)IUEvk+&&*$4bMZ2tuaLuTnHBA|Fgh9 z8s7EO$HE5~8El|cf!!23yHk2E>0#YOi~X_3`%;eu1x ze=6@Sc(+sYbiLzf{JH^J0=+MJ7I;-5Wh^xsryZr_OSKdxE~eJ}2!$WT4r4dW2~fWsx7Qak}=s>_YKx6eCg z%h!ug{Rq79{1+>W@=g64*BbDBSm=BS?7+o3dJ+_gcyw4N&WUwXd8yHG>eO}VZ%C@Y z)uIJT1pecTJ_GPUKT8wL~BVP7~}M;q4Yus7U6g*gUiQ={q3E2k~e-zryLC*t=G z0{{D&-sg8O4~87vXRP1R-239r=HBB+4w`Cz|9eM}fehkXQ1_0iMN0$%0s(=5KtLcM z5D*9m1Ox&C0fB%(Kp-Fx5C{ka1Ofs9fq+0jARrJB2nYlO0s;YnfIvVXAP^7;2m}NI z0s(=5KtLcM5D*C56A0k@#^N^)5omLhX;k`8A=~%<$@yi8w!!VMw+()o{xAFJ^f?-x zK8)+b73J}V(}~>DZ`i-A@7s+H)Q8Q?z3v<6e_{AOp9T6)$#wWVET`WNf9~Dff%iw! z9U=bj=Ffg=1;qzrW@VSZKaroZvfB$fOH$rAkx!)1?u>S+DbT~rC`~1K3 zyAh7S;S+vBN)buv>%QR+xzgh?a6u)DcH=%dHXL5pY#+sNPdhZ>qw?L;1Dc0M<=-yt za4YZ7xUhEBa{IJPSFZBcHFuW2q4~}zdG9n$8aDuMo7RlFA2r=Jy?xXLO>PQuPrv1s z|CXD=ZkPVdt^8+h3c6kTb_#dTzqtcEG^)Ms`Pbd#yW!Sea>J84M^z^h-xLD>50$gC AY5)KL literal 0 HcmV?d00001 diff --git a/src/assets/data/code.json b/src/assets/data/code.json new file mode 100644 index 0000000..e69de29 diff --git a/src/components/Demo/index.less b/src/components/Demo/index.less new file mode 100644 index 0000000..0c4bad1 --- /dev/null +++ b/src/components/Demo/index.less @@ -0,0 +1,3 @@ +.container { + width: 500px; +} diff --git a/src/components/Demo/index.tsx b/src/components/Demo/index.tsx new file mode 100644 index 0000000..e72bbcd --- /dev/null +++ b/src/components/Demo/index.tsx @@ -0,0 +1,15 @@ +import React from 'react'; +import { Button } from 'antd'; +import styles from './index.less'; + +const Demo: React.FunctionComponent = () => { + return ( +
+

title

+

demo

+ +
+ ); +}; + +export default Demo; diff --git a/src/components/PageHeader/index.tsx b/src/components/PageHeader/index.tsx new file mode 100644 index 0000000..2a054d3 --- /dev/null +++ b/src/components/PageHeader/index.tsx @@ -0,0 +1,22 @@ +import React from 'react'; +import Head from 'next/head'; + +interface PageHeaderProps { + title?: string; +} + +const PageHeader: React.FC = ({ title = 'Uni-Ubi' }) => { + return ( +
+ + {title} + + +
+ ); +}; + +export default PageHeader; diff --git a/src/interfaces/base.ts b/src/interfaces/base.ts new file mode 100644 index 0000000..d4e6472 --- /dev/null +++ b/src/interfaces/base.ts @@ -0,0 +1,8 @@ +export interface IPagination { + total: number; + size: number; + index: number; + length: number; + beginIndex: number; + endIndex: number; +} diff --git a/src/layouts/BasicLayout/index.tsx b/src/layouts/BasicLayout/index.tsx new file mode 100644 index 0000000..50abbc5 --- /dev/null +++ b/src/layouts/BasicLayout/index.tsx @@ -0,0 +1,14 @@ +import React from 'react'; +import PageHeader from '@/components/PageHeader'; + +const BasicLayout: React.FC = ({ children }) => { + return ( +
+ + +
{children}
+
+ ); +}; + +export default BasicLayout; diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx new file mode 100644 index 0000000..41fa471 --- /dev/null +++ b/src/pages/_app.tsx @@ -0,0 +1,7 @@ +import 'normalize.css/normalize.css'; + +function MyApp({ Component, pageProps }) { + return ; +} + +export default MyApp; diff --git a/src/pages/api/hello.ts b/src/pages/api/hello.ts new file mode 100644 index 0000000..4d1188a --- /dev/null +++ b/src/pages/api/hello.ts @@ -0,0 +1,6 @@ +// Next.js API route support: https://nextjs.org/docs/api-routes/introduction + +export default (_, res) => { + res.statusCode = 200; + res.json({ name: 'John Doe' }); +}; diff --git a/src/pages/index.tsx b/src/pages/index.tsx new file mode 100644 index 0000000..769813d --- /dev/null +++ b/src/pages/index.tsx @@ -0,0 +1,11 @@ +import BasicLayout from '@/layouts/BasicLayout'; +import Demo from '@/components/Demo'; + +export default function Home() { + return ( + +

标题

+ + + ); +} diff --git a/src/services/index.ts b/src/services/index.ts new file mode 100644 index 0000000..da93787 --- /dev/null +++ b/src/services/index.ts @@ -0,0 +1,16 @@ +import clientRequest from '@/utils/clientRequest'; + +export interface HelloWordParams { + pageIndex?: number; + pageSize?: number; + keyword: string; +} + +// 获取应用列表 +export const helloWordApi = (params: HelloWordParams): Promise =>{ + return clientRequest({ + url: '/test/helloWord', + params, + }); +} + diff --git a/src/styles/antd-custom.less b/src/styles/antd-custom.less new file mode 100644 index 0000000..e69de29 diff --git a/src/styles/var.less b/src/styles/var.less new file mode 100644 index 0000000..69f69b7 --- /dev/null +++ b/src/styles/var.less @@ -0,0 +1,90 @@ +// 颜色 +@S1: #25282a; +@S2: #1c21b8; +@S3: #2228e0; +@S4: #4046ff; +@S5: #9ca8ff; +@S6: #c9d2ff; +@M1: #000000; +@M2: #4a4a4a; +@M3: #7c7c7c; +@M4: #959595; +@M5: #c7c7c7; +@M6: #e0e0e0; +@M7: #f2f2f2; +@M8: #f9f9f9; +@M9: #ffffff; +@D1: #fac105; +@D2: #ffab24; +@D3: #ff6952; +@D4: #ff3c73; +@D5: #ee62d5; +@D6: #8475ff; +@D7: #4f73ff; +@D8: #148aff; +@D9: #0cc0c9; +@D10: #0cc991; +@D11: #83d615; +@D1-1: #fef8e5; +@D2-1: #fff6e9; +@D3-1: #fff0ed; +@D4-1: #ffebf1; +@D5-1: #fdeffa; +@D6-1: #f2f1ff; +@D7-1: #edf1ff; +@D8-1: #e7f3ff; +@D9-1: #e6f8f9; +@D10-1: #e6f9f3; +@D11-1: #f2fae7; +@F-info: #4766ff; +@F-success: #46cf84; +@F-warning: #ffa42e; +@F-red: #fa4646; + +/* 字体 */ +@Fs-1: 12px; +@Fs-2: 14px; +@Fs-3: 16px; +@Fs-4: 18px; +@Fs-5: 20px; +@Fs-6: 22px; +@Fs-7: 24px; +@Fs-8: 28px; +@Fs-9: 32px; + +/* 行高 */ +@Lh-1: 20px; +@Lh-2: 22px; +@Lh-3: 24px; +@Lh-4: 26px; +@Lh-5: 28px; +@Lh-6: 30px; +@Lh-7: 32px; +@Lh-8: 36px; +@Lh-9: 42px; + +// 间距 +@Sp-1: 2px; +@Sp-2: 4px; +@Sp-3: 8px; +@Sp-4: 10px; +@Sp-5: 12px; +@Sp-6: 16px; +@Sp-7: 20px; +@Sp-8: 24px; +@Sp-9: 30px; +@Sp-10: 32px; +@Sp-11: 40px; + +// 阴影 +@Sh-1: 0 0 8px 0 rgba(0, 0, 0, 0.05); +@Sh-2: 0 2px 8px 0 rgba(0, 0, 0, 0.1); +@Sh-3: 0 0 12px 0 rgba(0, 0, 0, 0.1); +@Sh-4: -4px 0 20px 0 rgba(0, 0, 0, 0.1); +@Sh-5: 0 2px 20px 0 rgba(0, 0, 0, 0.3); + +// 圆角 +@Ra-1: 2px; +@Ra-2: 3px; +@Ra-3: 6px; +@Ra-4: 10px; diff --git a/src/utils/clientRequest.ts b/src/utils/clientRequest.ts new file mode 100644 index 0000000..7173c5c --- /dev/null +++ b/src/utils/clientRequest.ts @@ -0,0 +1,50 @@ +import axios from 'axios'; +import { message } from 'antd'; +import { IPagination } from '@/interfaces/base'; +import codeMsg from '@/assets/data/code.json'; + +export interface BaseResponse { + code: string; + msg: string; + memo?: string; + data: any; + page?: IPagination; + result: number; + success: boolean; +} + +const DEFAULT_TIP_MESSAGE = '请求失败，请刷新重试'; + +const handleError = (data: BaseResponse) => { + const msg = codeMsg[data.code] || data.msg || DEFAULT_TIP_MESSAGE; + message.error(msg); +}; + +// create an axios instance +const service = axios.create({ + baseURL: process.env.CLIENT_BASE_API, // api的base_url + method: 'GET', + // timeout: 5000, // request timeout +}); +// request interceptor +service.interceptors.request.use( + (config) => config, + (error) => Promise.reject(error), +); + +// response interceptor +service.interceptors.response.use( + (response) => { + const res = response.data; + if (!res.success) { + handleError(res); + } + return res; + }, + (error) => { + handleError(error); + return Promise.reject(error); + }, +); + +export default service; diff --git a/src/utils/serverRequest.ts b/src/utils/serverRequest.ts new file mode 100644 index 0000000..58fe1c0 --- /dev/null +++ b/src/utils/serverRequest.ts @@ -0,0 +1,21 @@ +import axios from 'axios'; + +// create an axios instance +const service = axios.create({ + timeout: 5000, // request timeout + withCredentials: true, +}); + +// request interceptor +service.interceptors.request.use( + (config) => config, + (error) => Promise.reject(error), +); + +// response interceptor +service.interceptors.response.use( + (response) => response, + (error) => Promise.reject(error), +); + +export default service; diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..d6f4863 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,24 @@ +{ + "compilerOptions": { + "baseUrl": ".", + "paths": { + "@/*": ["src/*"], + "@static/*": ["static/*"] + }, + "target": "es5", + "lib": ["dom", "dom.iterable", "esnext"], + "allowJs": true, + "skipLibCheck": true, + "strict": false, + "forceConsistentCasingInFileNames": true, + "noEmit": true, + "esModuleInterop": true, + "module": "esnext", + "moduleResolution": "node", + "resolveJsonModule": true, + "isolatedModules": true, + "jsx": "preserve" + }, + "exclude": ["node_modules"], + "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"] +} diff --git a/typings.d.ts b/typings.d.ts new file mode 100644 index 0000000..5681185 --- /dev/null +++ b/typings.d.ts @@ -0,0 +1,3 @@ +declare module '*.png'; +declare module '*.css'; +declare module '*.less';