feat: update project configuration and structure

- Updated project.config.json with new project name and settings.
- Removed unused app.scss and index.scss files, replaced with CSS files.
- Refactored app.ts to utilize Taro's useLaunch hook for app initialization.
- Simplified index.tsx to display a basic greeting and user info button.
- Added new project.xhs.json for XHS platform configuration.
- Introduced is-xhs utility function to check for XHS environment.
- Updated tsconfig.json to include path mappings and additional include paths.
This commit is contained in:
2026-03-12 17:45:09 +08:00
parent c4b288ac17
commit 7b760d20f3
18 changed files with 4167 additions and 2576 deletions

View File

@@ -1,12 +0,0 @@
# http://editorconfig.org
root = true
[*]
indent_style = space
indent_size = 2
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.md]
trim_trailing_whitespace = false

View File

@@ -1,4 +1,4 @@
module.exports = { {
"extends": ["taro/react"], "extends": ["taro/react"],
"rules": { "rules": {
"react/jsx-uses-react": "off", "react/jsx-uses-react": "off",

2
.gitignore vendored
View File

@@ -5,3 +5,5 @@ deploy_versions/
node_modules/ node_modules/
.DS_Store .DS_Store
.swc .swc
*.local
.env*

View File

@@ -1,24 +1,11 @@
// babel-preset-taro 更多选项和默认值: // babel-preset-taro 更多选项和默认值:
// https://github.com/NervJS/taro/blob/next/packages/babel-preset-taro/README.md // https://docs.taro.zone/docs/next/babel-config
module.exports = { module.exports = {
presets: [ presets: [
['taro', ['taro', {
{
framework: 'react', framework: 'react',
ts: 'true', ts: true,
compiler: 'vite', compiler: 'webpack5',
}] }]
],
plugins: [
[
"import",
{
"libraryName": "@nutui/nutui-react-taro",
"libraryDirectory": "dist/esm",
"style": 'css',
"camel2DashComponentName": false
},
'nutui-react-taro'
]
] ]
} }

View File

@@ -1,6 +1,10 @@
import type { UserConfigExport } from "@tarojs/cli"; import type { UserConfigExport } from "@tarojs/cli"
export default {
export default {
logger: {
quiet: false,
stats: true
},
mini: {}, mini: {},
h5: {} h5: {}
} satisfies UserConfigExport<'vite'> } satisfies UserConfigExport<'webpack5'>

View File

@@ -1,99 +1,102 @@
import { defineConfig, type UserConfigExport } from '@tarojs/cli' import { defineConfig, type UserConfigExport } from "@tarojs/cli";
import devConfig from './dev' import TsconfigPathsPlugin from "tsconfig-paths-webpack-plugin";
import prodConfig from './prod' import devConfig from "./dev";
import vitePluginImp from 'vite-plugin-imp' import prodConfig from "./prod";
// https://taro-docs.jd.com/docs/next/config#defineconfig-辅助函数 // https://taro-docs.jd.com/docs/next/config#defineconfig-辅助函数
export default defineConfig<'vite'>(async (merge, { command, mode }) => { // @ts-ignore
const baseConfig: UserConfigExport<'vite'> = { export default defineConfig<"webpack5">(async (merge, { command, mode }) => {
projectName: 'taro-template', const baseConfig: UserConfigExport<"webpack5"> = {
date: '2026-3-12', projectName: "2025-09-14-webpack-demo",
designWidth: 375, date: "2025-9-14",
designWidth: 750,
deviceRatio: { deviceRatio: {
640: 2.34 / 2, 640: 2.34 / 2,
750: 1, 750: 1,
375: 2, 375: 2,
828: 1.81 / 2 828: 1.81 / 2,
},
sourceRoot: 'src',
outputRoot: 'dist',
plugins: ['@tarojs/plugin-html'],
defineConstants: {
}, },
sourceRoot: "src",
outputRoot: "dist",
plugins: ["@tarojs/plugin-generator"],
// plugins: ["@tarojs/plugin-generator", "@tarojs/plugin-platform-xhs"],
defineConstants: {},
copy: { copy: {
patterns: [ patterns: [],
], options: {},
options: {
}
}, },
framework: 'react', framework: "react",
compiler: { compiler: "webpack5",
vitePlugins: [vitePluginImp({ cache: {
libList: [ enable: false, // Webpack 持久化缓存配置建议开启。默认配置请参考https://docs.taro.zone/docs/config-detail#cache
{
libName: '@nutui/nutui-react-taro',
style: (name) => {
return `@nutui/nutui-react-taro/dist/esm/${name}/style/css`
},
replaceOldImport: false,
camel2DashComponentName: false,
}
]
})],
type: 'vite'
}, },
mini: { mini: {
postcss: { postcss: {
pxtransform: { pxtransform: {
enable: true, enable: true,
config: { config: {},
selectorBlackList: ['nut-']
}
}, },
cssModules: { cssModules: {
enable: false, // 默认为 false如需使用 css modules 功能,则设为 true enable: false, // 默认为 false如需使用 css modules 功能,则设为 true
config: { config: {
namingPattern: 'module', // 转换模式,取值为 global/module namingPattern: "module", // 转换模式,取值为 global/module
generateScopedName: '[name]__[local]___[hash:base64:5]' generateScopedName: "[name]__[local]___[hash:base64:5]",
} },
} },
},
webpackChain(chain) {
chain.resolve.plugin("tsconfig-paths").use(TsconfigPathsPlugin);
}, },
}, },
h5: { h5: {
publicPath: '/', publicPath: "/",
staticDirectory: 'static', staticDirectory: "static",
output: {
filename: "js/[name].[hash:8].js",
chunkFilename: "js/[name].[chunkhash:8].js",
},
miniCssExtractPluginOption: { miniCssExtractPluginOption: {
ignoreOrder: true, ignoreOrder: true,
filename: 'css/[name].[hash].css', filename: "css/[name].[hash].css",
chunkFilename: 'css/[name].[chunkhash].css' chunkFilename: "css/[name].[chunkhash].css",
}, },
postcss: { postcss: {
autoprefixer: { autoprefixer: {
enable: true, enable: true,
config: {} config: {},
}, },
cssModules: { cssModules: {
enable: false, // 默认为 false如需使用 css modules 功能,则设为 true enable: false, // 默认为 false如需使用 css modules 功能,则设为 true
config: { config: {
namingPattern: 'module', // 转换模式,取值为 global/module namingPattern: "module", // 转换模式,取值为 global/module
generateScopedName: '[name]__[local]___[hash:base64:5]' generateScopedName: "[name]__[local]___[hash:base64:5]",
} },
} },
},
webpackChain(chain) {
chain.resolve.plugin("tsconfig-paths").use(TsconfigPathsPlugin);
chain.set("ignoreWarnings", [
{
module: /@tarojs\/components/,
message: /webpackExports/,
},
]);
}, },
}, },
rn: { rn: {
appName: 'taroDemo', appName: "taroDemo",
postcss: { postcss: {
cssModules: { cssModules: {
enable: false, // 默认为 false如需使用 css modules 功能,则设为 true enable: false, // 默认为 false如需使用 css modules 功能,则设为 true
} },
} },
} },
} };
if (process.env.NODE_ENV === 'development') {
if (process.env.NODE_ENV === "development") {
// 本地开发构建配置(不混淆压缩) // 本地开发构建配置(不混淆压缩)
return merge({}, baseConfig, devConfig) return merge({}, baseConfig, devConfig);
} }
// 生产构建配置(默认开启压缩混淆等) // 生产构建配置(默认开启压缩混淆等)
return merge({}, baseConfig, prodConfig) return merge({}, baseConfig, prodConfig);
}) });

View File

@@ -1,4 +1,5 @@
import type { UserConfigExport } from "@tarojs/cli"; import type { UserConfigExport } from "@tarojs/cli"
export default { export default {
mini: {}, mini: {},
h5: { h5: {
@@ -29,4 +30,4 @@ export default {
// })) // }))
// } // }
} }
} satisfies UserConfigExport<'vite'> } satisfies UserConfigExport<'webpack5'>

View File

@@ -2,14 +2,15 @@
"name": "taro-template", "name": "taro-template",
"version": "1.0.0", "version": "1.0.0",
"private": true, "private": true,
"description": "taro模板", "description": "taro-template",
"templateInfo": { "templateInfo": {
"name": "react-NutUI", "name": "default",
"typescript": true, "typescript": true,
"css": "Sass", "css": "None",
"framework": "React" "framework": "React"
}, },
"scripts": { "scripts": {
"new": "taro new",
"build:weapp": "taro build --type weapp", "build:weapp": "taro build --type weapp",
"build:swan": "taro build --type swan", "build:swan": "taro build --type swan",
"build:alipay": "taro build --type alipay", "build:alipay": "taro build --type alipay",
@@ -18,7 +19,9 @@
"build:rn": "taro build --type rn", "build:rn": "taro build --type rn",
"build:qq": "taro build --type qq", "build:qq": "taro build --type qq",
"build:jd": "taro build --type jd", "build:jd": "taro build --type jd",
"build:quickapp": "taro build --type quickapp", "build:harmony-hybrid": "taro build --type harmony-hybrid",
"build:xhs": "taro build --type xhs",
"dev:xhs": "npm run build:xhs -- --watch",
"dev:weapp": "npm run build:weapp -- --watch", "dev:weapp": "npm run build:weapp -- --watch",
"dev:swan": "npm run build:swan -- --watch", "dev:swan": "npm run build:swan -- --watch",
"dev:alipay": "npm run build:alipay -- --watch", "dev:alipay": "npm run build:alipay -- --watch",
@@ -27,60 +30,53 @@
"dev:rn": "npm run build:rn -- --watch", "dev:rn": "npm run build:rn -- --watch",
"dev:qq": "npm run build:qq -- --watch", "dev:qq": "npm run build:qq -- --watch",
"dev:jd": "npm run build:jd -- --watch", "dev:jd": "npm run build:jd -- --watch",
"dev:quickapp": "npm run build:quickapp -- --watch" "dev:harmony-hybrid": "npm run build:harmony-hybrid -- --watch"
}, },
"browserslist": [ "browserslist": [
"last 3 versions", "defaults and fully supports es6-module",
"Android >= 4.1", "maintained node versions"
"ios >= 8"
], ],
"author": "", "author": "",
"dependencies": { "dependencies": {
"@babel/runtime": "^7.21.5", "@babel/runtime": "^7.28.6",
"@tarojs/components": "4.1.11", "@tarojs/components": "4.1.11",
"@tarojs/helper": "4.1.11", "@tarojs/helper": "4.1.11",
"@tarojs/plugin-platform-weapp": "4.1.11", "@tarojs/plugin-framework-react": "4.1.11",
"@tarojs/plugin-platform-alipay": "4.1.11", "@tarojs/plugin-platform-alipay": "4.1.11",
"@tarojs/plugin-platform-tt": "4.1.11", "@tarojs/plugin-platform-h5": "4.1.11",
"@tarojs/plugin-platform-swan": "4.1.11", "@tarojs/plugin-platform-harmony-hybrid": "4.1.11",
"@tarojs/plugin-platform-jd": "4.1.11", "@tarojs/plugin-platform-jd": "4.1.11",
"@tarojs/plugin-platform-qq": "4.1.11", "@tarojs/plugin-platform-qq": "4.1.11",
"@tarojs/plugin-platform-h5": "4.1.11", "@tarojs/plugin-platform-swan": "4.1.11",
"@tarojs/plugin-html": "4.1.11", "@tarojs/plugin-platform-tt": "4.1.11",
"@tarojs/plugin-platform-weapp": "4.1.11",
"@tarojs/plugin-platform-xhs": "^1.2.2",
"@tarojs/react": "4.1.11",
"@tarojs/runtime": "4.1.11", "@tarojs/runtime": "4.1.11",
"@tarojs/shared": "4.1.11", "@tarojs/shared": "4.1.11",
"@tarojs/taro": "4.1.11", "@tarojs/taro": "4.1.11",
"@nutui/nutui-react-taro": "^2.6.14", "react": "^18.3.1",
"@tarojs/plugin-framework-react": "4.1.11", "react-dom": "^18.3.1"
"@tarojs/react": "4.1.11",
"react-dom": "^18.0.0",
"react": "^18.0.0"
}, },
"devDependencies": { "devDependencies": {
"@babel/preset-react": "^7.24.1", "@babel/core": "^7.29.0",
"@babel/plugin-proposal-class-properties": "7.14.5", "@babel/plugin-transform-class-properties": "7.28.6",
"@babel/core": "^7.8.0", "@babel/preset-react": "^7.28.5",
"babel-plugin-import": "^1.13.8", "@pmmmwh/react-refresh-webpack-plugin": "^0.6.2",
"@tarojs/cli": "4.1.11", "@tarojs/cli": "4.1.11",
"@tarojs/vite-runner": "4.1.11", "@tarojs/plugin-generator": "4.1.11",
"@tarojs/taro-loader": "4.1.11",
"@tarojs/webpack5-runner": "4.1.11",
"@types/node": "^25",
"@types/react": "^18.3.23",
"@types/webpack-env": "^1.18.8",
"babel-preset-taro": "4.1.11", "babel-preset-taro": "4.1.11",
"eslint-config-taro": "4.1.11", "eslint-plugin-react": "^7.37.5",
"eslint": "^8.12.0", "eslint-plugin-react-hooks": "^7.0.1",
"stylelint": "^14.4.0", "postcss": "^8.5.8",
"terser": "^5.16.8", "react-refresh": "^0.18.0",
"vite": "^4.2.0", "tsconfig-paths-webpack-plugin": "^4.2.0",
"vite-plugin-imp": "^2.4.0", "typescript": "^5.9.3",
"@tarojs/test-utils-react": "^0.1.1", "webpack": "5.105.4"
"@types/react": "^18.0.0",
"@vitejs/plugin-react": "^4.1.0",
"eslint-plugin-react": "^7.8.2",
"eslint-plugin-import": "^2.12.0",
"eslint-plugin-react-hooks": "^4.2.0",
"react-refresh": "^0.11.0",
"sass": "^1.60.0",
"@typescript-eslint/parser": "^6.2.0",
"@typescript-eslint/eslint-plugin": "^6.2.0",
"typescript": "^5.1.0",
"postcss": "^8.4.18"
} }
} }

6276
pnpm-lock.yaml generated

File diff suppressed because it is too large Load Diff

View File

@@ -1,7 +1,7 @@
{ {
"miniprogramRoot": "dist/", "miniprogramRoot": "./dist",
"projectname": "taro-template", "projectname": "2026-03-12-taro-template",
"description": "taro模板", "description": "taro-template",
"appid": "touristappid", "appid": "touristappid",
"setting": { "setting": {
"urlCheck": true, "urlCheck": true,
@@ -9,17 +9,7 @@
"enhance": false, "enhance": false,
"compileHotReLoad": false, "compileHotReLoad": false,
"postcss": false, "postcss": false,
"preloadBackgroundData": false, "minified": false
"minified": false,
"newFeature": true,
"autoAudits": false,
"coverView": true,
"showShadowRootInWxmlPanel": false,
"scopeDataCheck": false,
"useCompilerModule": false
}, },
"compileType": "miniprogram", "compileType": "miniprogram"
"simulatorType": "wechat",
"simulatorPluginLibVersion": {},
"condition": {}
} }

75
project.xhs.json Normal file
View File

@@ -0,0 +1,75 @@
{
"description": "项目配置文件",
"packOptions": {
"ignore": []
},
"setting": {
"minified": true,
"urlCheck": true,
"useNewDevtools": false,
"enableSimulatorV2": true,
"enableV2": false,
"enableVDom": true,
"useNewCompiler": true,
"bundle": false,
"userConfirmedBundleSwitch": false,
"scopeDataCheck": false,
"coverView": true,
"es6": true,
"postcss": true,
"compileHotReLoad": false,
"lazyloadPlaceholderEnable": false,
"preloadBackgroundData": false,
"autoAudits": false,
"newFeature": false,
"uglifyFileName": false,
"uploadWithSourceMap": true,
"useIsolateContext": true,
"nodeModules": false,
"enhance": true,
"useMultiFrameRuntime": true,
"useApiHook": true,
"useApiHostProcess": true,
"showShadowRootInWxmlPanel": true,
"packNpmManually": false,
"enableEngineNative": false,
"packNpmRelationList": [],
"minifyWXSS": true,
"showES6CompileOption": false,
"useLiteCompiler": true
},
"compileType": "miniprogram",
"libVersion": "3.116.2",
"projectname": "xhs-demo",
"debugOptions": {
"hidedInDevtools": []
},
"appid": "68c47321131b9b0001166b7d",
"scripts": {},
"staticServerOptions": {
"baseURL": "",
"servePath": ""
},
"isGameTourist": false,
"condition": {
"search": {
"list": []
},
"conversation": {
"list": []
},
"game": {
"list": []
},
"plugin": {
"list": []
},
"gamePlugin": {
"list": []
},
"miniprogram": {
"list": []
}
},
"projectName": "jd-code-exchange"
}

View File

@@ -1,19 +1,26 @@
import { useEffect } from 'react' import { PropsWithChildren } from "react";
import { useDidShow, useDidHide } from '@tarojs/taro' import { useLaunch } from "@tarojs/taro";
// 全局样式
import './app.scss'
function App(props) { import "./app.css";
// 可以使用所有的 React Hooks import Taro from "@tarojs/taro";
useEffect(() => { })
// 对应 onShow function App({ children }: PropsWithChildren<any>) {
useDidShow(() => { }) useLaunch(() => {
console.log("App launched.");
console.log(Taro.getEnv(), Taro.ENV_TYPE);
if (Taro.getEnv() === Taro.ENV_TYPE.WEAPP) {
Taro.login({
success: function (res) {
console.log("login success", res);
},
});
} else {
console.log("Not in a mini program environment, skipping login.");
}
});
// 对应 onHide // children 是将要会渲染的页面
useDidHide(() => { }) return children;
return props.children
} }
export default App export default App;

View File

@@ -1,28 +1,23 @@
import { useState } from 'react' import { View, Text, Button } from "@tarojs/components";
import { View } from '@tarojs/components' import { useLoad } from "@tarojs/taro";
import { ConfigProvider } from '@nutui/nutui-react-taro' import "./index.css";
import './index.scss'
function Index() { export default function Index() {
const [translated] = useState({ useLoad(() => {
zhCN: { console.log("Page loaded.");
welcome: '欢迎使用 NutUI React 开发 Taro 多端项目。', });
button: '使用英文',
open: '点击打开',
},
enUS: {
welcome: 'Welcome to use NutUI React to develop Taro multi-terminal projects.',
button: 'Use Chinese',
open: 'Click Me',
},
})
return ( return (
<ConfigProvider> <View className="index">
<View className='nutui-react-demo'> <Text>Hello world!</Text>
<View className='welcome'>{translated.zhCN.welcome}</View> <Button
openType="getUserInfo"
onGetUserInfo={(e) => {
console.log("onGetUserInfoEventDetail", e);
}}
>
User Info
</Button>
</View> </View>
</ConfigProvider> );
)
} }
export default Index

View File

@@ -0,0 +1,6 @@
import Taro from "@tarojs/taro";
export const isXHS = () => {
// @ts-ignore
return Taro.getEnv() === "xhs";
};

View File

@@ -13,15 +13,18 @@
"noUnusedParameters": true, "noUnusedParameters": true,
"strictNullChecks": true, "strictNullChecks": true,
"sourceMap": true, "sourceMap": true,
"baseUrl": ".",
"rootDir": ".", "rootDir": ".",
"jsx": "react-jsx", "jsx": "react-jsx",
"allowJs": true, "allowJs": true,
"resolveJsonModule": true, "resolveJsonModule": true,
"typeRoots": [ "typeRoots": [
"node_modules/@types" "node_modules/@types"
] ],
"paths": {
// TS5090 leading './'
"@/*": ["./src/*"]
}
}, },
"include": ["./src", "./types"], "include": ["./src", "./types", "./config"],
"compileOnSave": false "compileOnSave": false
} }

4
types/global.d.ts vendored
View File

@@ -16,7 +16,7 @@ declare namespace NodeJS {
/** NODE 内置环境变量, 会影响到最终构建生成产物 */ /** NODE 内置环境变量, 会影响到最终构建生成产物 */
NODE_ENV: 'development' | 'production', NODE_ENV: 'development' | 'production',
/** 当前构建的平台 */ /** 当前构建的平台 */
TARO_ENV: 'weapp' | 'swan' | 'alipay' | 'h5' | 'rn' | 'tt' | 'quickapp' | 'qq' | 'jd' TARO_ENV: 'weapp' | 'swan' | 'alipay' | 'h5' | 'rn' | 'tt' | 'qq' | 'jd' | 'harmony' | 'jdrn' | 'xhs'
/** /**
* 当前构建的小程序 appid * 当前构建的小程序 appid
* @description 若不同环境有不同的小程序,可通过在 env 文件中配置环境变量`TARO_APP_ID`来方便快速切换 appid 而不必手动去修改 dist/project.config.json 文件 * @description 若不同环境有不同的小程序,可通过在 env 文件中配置环境变量`TARO_APP_ID`来方便快速切换 appid 而不必手动去修改 dist/project.config.json 文件
@@ -25,3 +25,5 @@ declare namespace NodeJS {
TARO_APP_ID: string TARO_APP_ID: string
} }
} }