初始化项目

babel.config.js

@@ -0,0 +1,10 @@
+// babel-preset-taro 更多选项和默认值：
+// https://github.com/NervJS/taro/blob/next/packages/babel-preset-taro/README.md
+module.exports = {
+  presets: [
+    ['taro', {
+      framework: 'react',
+      ts: false
+    }]
+  ]
+}

config/dev.js

@@ -0,0 +1,9 @@
+module.exports = {
+  env: {
+    NODE_ENV: '"development"'
+  },
+  defineConstants: {
+  },
+  mini: {},
+  h5: {}
+}

config/index.js

@@ -0,0 +1,79 @@
+const config = {
+  projectName: 'fish_app',
+  date: '2024-11-13',
+  designWidth: 750,
+  deviceRatio: {
+    640: 2.34 / 2,
+    750: 1,
+    828: 1.81 / 2
+  },
+  sourceRoot: 'src',
+  outputRoot: 'dist',
+  plugins: [],
+  defineConstants: {
+  },
+  copy: {
+    patterns: [
+    ],
+    options: {
+    }
+  },
+  framework: 'react',
+  compiler: 'webpack4',
+  mini: {
+    postcss: {
+      pxtransform: {
+        enable: true,
+        config: {
+
+        }
+      },
+      url: {
+        enable: true,
+        config: {
+          limit: 1024 // 设定转换尺寸上限
+        }
+      },
+      cssModules: {
+        enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
+        config: {
+          namingPattern: 'module', // 转换模式，取值为 global/module
+          generateScopedName: '[name]__[local]___[hash:base64:5]'
+        }
+      }
+    }
+  },
+  h5: {
+    publicPath: '/',
+    staticDirectory: 'static',
+    postcss: {
+      autoprefixer: {
+        enable: true,
+        config: {
+        }
+      },
+      cssModules: {
+        enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
+        config: {
+          namingPattern: 'module', // 转换模式，取值为 global/module
+          generateScopedName: '[name]__[local]___[hash:base64:5]'
+        }
+      }
+    }
+  },
+  rn: {
+    appName: 'taroDemo',
+    postcss: {
+      cssModules: {
+        enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
+      }
+    }
+  }
+}
+
+module.exports = function (merge) {
+  if (process.env.NODE_ENV === 'development') {
+    return merge({}, config, require('./dev'))
+  }
+  return merge({}, config, require('./prod'))
+}

config/prod.js

@@ -0,0 +1,37 @@
+module.exports = {
+  env: {
+    NODE_ENV: '"production"'
+  },
+  defineConstants: {
+  },
+  mini: {},
+  h5: {
+    /**
+     * WebpackChain 插件配置
+     * @docs https://github.com/neutrinojs/webpack-chain
+     */
+    // webpackChain (chain) {
+    //   /**
+    //    * 如果 h5 端编译后体积过大，可以使用 webpack-bundle-analyzer 插件对打包体积进行分析。
+    //    * @docs https://github.com/webpack-contrib/webpack-bundle-analyzer
+    //    */
+    //   chain.plugin('analyzer')
+    //     .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin, [])
+
+    //   /**
+    //    * 如果 h5 端首屏加载时间过长，可以使用 prerender-spa-plugin 插件预加载首页。
+    //    * @docs https://github.com/chrisvfritz/prerender-spa-plugin
+    //    */
+    //   const path = require('path')
+    //   const Prerender = require('prerender-spa-plugin')
+    //   const staticDir = path.join(__dirname, '..', 'dist')
+    //   chain
+    //     .plugin('prerender')
+    //     .use(new Prerender({
+    //       staticDir,
+    //       routes: [ '/pages/index/index' ],
+    //       postProcess: (context) => ({ ...context, outputPath: path.join(staticDir, 'index.html') })
+    //     }))
+    // }
+  }
+}

package.json

@@ -0,0 +1,76 @@
+{
+  "name": "fish_app",
+  "version": "1.0.0",
+  "private": true,
+  "description": "yushi",
+  "templateInfo": {
+    "name": "default",
+    "typescript": false,
+    "css": "less"
+  },
+  "scripts": {
+    "build:weapp": "taro build --type weapp",
+    "build:swan": "taro build --type swan",
+    "build:alipay": "taro build --type alipay",
+    "build:tt": "taro build --type tt",
+    "build:h5": "taro build --type h5",
+    "build:rn": "taro build --type rn",
+    "build:qq": "taro build --type qq",
+    "build:jd": "taro build --type jd",
+    "build:quickapp": "taro build --type quickapp",
+    "dev:weapp": "npm run build:weapp -- --watch",
+    "dev:swan": "npm run build:swan -- --watch",
+    "dev:alipay": "npm run build:alipay -- --watch",
+    "dev:tt": "npm run build:tt -- --watch",
+    "dev:h5": "npm run build:h5 -- --watch",
+    "dev:rn": "npm run build:rn -- --watch",
+    "dev:qq": "npm run build:qq -- --watch",
+    "dev:jd": "npm run build:jd -- --watch",
+    "dev:quickapp": "npm run build:quickapp -- --watch"
+  },
+  "browserslist": [
+    "last 3 versions",
+    "Android >= 4.1",
+    "ios >= 8"
+  ],
+  "author": "",
+  "dependencies": {
+    "@babel/runtime": "^7.7.7",
+    "@tarojs/components": "3.5.7",
+    "@tarojs/helper": "3.5.7",
+    "@tarojs/plugin-framework-react": "3.5.7",
+    "@tarojs/plugin-platform-alipay": "3.5.7",
+    "@tarojs/plugin-platform-jd": "3.5.7",
+    "@tarojs/plugin-platform-qq": "3.5.7",
+    "@tarojs/plugin-platform-swan": "3.5.7",
+    "@tarojs/plugin-platform-tt": "3.5.7",
+    "@tarojs/plugin-platform-weapp": "3.5.7",
+    "@tarojs/react": "3.5.7",
+    "@tarojs/router": "3.5.7",
+    "@tarojs/runtime": "3.5.7",
+    "@tarojs/shared": "3.5.7",
+    "@tarojs/taro": "3.5.7",
+    "@tarojs/taro-h5": "3.5.7",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "taro-ui": "^3.3.0"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.8.0",
+    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.5",
+    "@tarojs/cli": "3.5.7",
+    "@tarojs/mini-runner": "3.5.7",
+    "@tarojs/webpack-runner": "3.5.7",
+    "@types/react": "^18.0.0",
+    "@types/webpack-env": "^1.13.6",
+    "babel-preset-taro": "3.5.7",
+    "eslint": "^8.12.0",
+    "eslint-config-taro": "3.5.7",
+    "eslint-plugin-import": "^2.12.0",
+    "eslint-plugin-react": "^7.8.2",
+    "eslint-plugin-react-hooks": "^4.2.0",
+    "react-refresh": "^0.11.0",
+    "stylelint": "^14.4.0",
+    "webpack": "4.46.0"
+  }
+}

project.config.json

@@ -0,0 +1,29 @@
+{
+  "miniprogramRoot": "dist/weapp/",
+  "projectname": "鱼市",
+  "description": "鱼市",
+  "appid": "wxcf756553cfb65cb8",
+  "setting": {
+      "urlCheck": true,
+      "es6": false,
+      "postcss": false,
+      "minified": false,
+      "babelSetting": {
+          "ignore": [],
+          "disablePlugins": [],
+          "outputPath": ""
+      }
+  },
+  "compileType": "miniprogram",
+  "libVersion": "2.26.0",
+  "srcMiniprogramRoot": "dist/",
+  "packOptions": {
+      "ignore": [],
+      "include": []
+  },
+  "condition": {},
+  "editorSetting": {
+      "tabIndent": "insertSpaces",
+      "tabSize": 2
+  }
+}

project.tt.json

@@ -0,0 +1,9 @@
+{
+  "miniprogramRoot": "./",
+  "projectname": "fish_app",
+  "appid": "testAppId",
+  "setting": {
+    "es6": false,
+    "minified": false
+  }
+}

src/api/config.js

@@ -0,0 +1,6 @@
+// 配置请求对象
+// 本地调试 dev 开发阶段
+// export const baseUrl = "https://test-openai.fyshark.com";//测试
+export const baseUrl = "https://openai.fyshark.com";//正式
+
+

src/api/request.js

@@ -0,0 +1,47 @@
+import Taro from '@tarojs/taro';
+import ttappid from '../../project.tt.json'//抖音
+import wxappid from '../../project.config.json'//微信
+import { baseUrl } from './config';
+
+
+export default (options = {
+  method: 'GET',
+  data: {}
+}) => {
+
+  // 必传参数
+  const request_data = {
+    session_key: Taro.getStorageSync('session_key') || ''//缓存取值
+  };
+  if (process.env.TARO_ENV === 'weapp') {
+    request_data['appid'] = wxappid.appid
+  } else if (process.env.TARO_ENV === 'tt') {
+    request_data['appid'] = ttappid.appid
+  }
+  return Taro.request({
+    url: baseUrl + options.url,
+    data: {
+      ...request_data,
+      ...options.data,
+    },
+    header: {
+      'Content-Type': 'application/json',
+      'accept': 'application/json'
+    },
+    method: options.method.toUpperCase(),
+  }).then(res => {
+    const {
+      code,
+      data
+    } = res;
+    if (code == 200) {
+      return data;
+    } else {
+      Taro.showToast({
+        title: `${res.msg}~`,
+        icon: 'none',
+        mask: true,
+      });
+    }
+  });
+};

src/app.config.js

@@ -0,0 +1,49 @@
+
+import Taro from '@tarojs/taro'
+export default defineAppConfig({
+  pages: [
+    'pages/index/index',
+    'pages/member/index',
+    "pages/mine/index",
+  ],
+  subpackages: [
+  ],
+  navigateToMiniProgramAppIdList: [
+    "ttf31985a46c214faf"
+  ],
+  window: {
+    backgroundTextStyle: 'light',
+    navigationBarBackgroundColor: '#FFFFFF',
+    navigationBarTitleText: '鱼市',
+    navigationBarTextStyle: 'black',
+    backgroundColor: "#FFFFFF"
+  },
+  tabBar: {
+    color: "#C6C6C6",
+    selectedColor: "#0F84EC",
+    borderStyle: "black",
+    backgroundColor: "#FFFFFF",
+    list: [
+      {
+        pagePath: "pages/index/index",
+        iconPath: "images/nav/play.png",
+        selectedIconPath: "images/nav/play_pin.png",
+        text: "首页"
+      },
+      {
+        pagePath: "pages/member/index",
+        iconPath: "images/nav/like.png",
+        selectedIconPath: "images/nav/like_pin.png",
+        text: "会员"
+
+      },
+
+      {
+        pagePath: "pages/mine/index",
+        iconPath: "images/nav/my.png",
+        selectedIconPath: "images/nav/my_pin.png",
+        text: "我的"
+      }
+    ]
+  },
+})

src/app.js

@@ -0,0 +1,19 @@
+import { Component } from 'react'
+import './app.less'
+import 'taro-ui/dist/style/index.scss'
+
+class App extends Component {
+
+  componentDidMount () {}
+
+  componentDidShow () {}
+
+  componentDidHide () {}
+
+  render () {
+    // this.props.children 是将要会渲染的页面
+    return this.props.children
+  }
+}
+
+export default App

src/app.less

@@ -0,0 +1,3 @@
+body {
+  background-color: #F9F9F9;
+}

src/index.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
+  <meta content="width=device-width,initial-scale=1,user-scalable=no" name="viewport">
+  <meta name="apple-mobile-web-app-capable" content="yes">
+  <meta name="apple-touch-fullscreen" content="yes">
+  <meta name="format-detection" content="telephone=no,address=no">
+  <meta name="apple-mobile-web-app-status-bar-style" content="white">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" >
+  <title>fish_app</title>
+  <script><%= htmlWebpackPlugin.options.script %></script>
+</head>
+<body>
+  <div id="app"></div>
+</body>
+</html>

src/pages/index/index.config.js

@@ -0,0 +1,4 @@
+export default definePageConfig({
+
+  navigationStyle: 'custom'
+})

src/pages/index/index.jsx

@@ -0,0 +1,51 @@
+import { Component } from 'react'
+import { View, Image, Button, Input } from '@tarojs/components'
+import { AtIcon } from 'taro-ui'
+import './index.less'
+
+export default class Index extends Component {
+  state = {
+    value: ''
+  }
+
+  handleChange (value) {
+    this.setState({ value })
+  }
+
+  componentWillMount () { }
+
+  componentDidMount () { }
+
+  componentWillUnmount () { }
+
+  componentDidShow () { }
+
+  componentDidHide () { }
+
+  render () {
+    return (
+      <View className='index'>
+        <View className='header'>
+          <View className='header-content'>
+            <Image className='header-img' src='https://video-img.fyshark.com/1731495433480WechatIMG674.jpg' />
+          </View>
+          <View className='search-wrap'>
+            <View className='search-bar'>
+              <AtIcon className='search-icon' value='search' size='24' color='#ACACAC'></AtIcon>
+              <Input
+                type='text'
+                className='search-input'
+                placeholder='夏季男士T恤'
+                value={this.state.value}
+                onInput={this.handleChange.bind(this)}
+              />
+              <View className='search-button'>
+                搜索
+              </View>
+            </View>
+          </View>
+        </View>
+      </View>
+    )
+  }
+}

src/pages/index/index.less

@@ -0,0 +1,53 @@
+.index {
+  .header {
+    width: 100%;
+    height: 500px;
+    background-color: #FDF652;
+    padding-top: 70px;
+
+    .header-content {
+      width: 100%;
+      display: flex;
+      justify-content: center;
+
+      .header-img {
+        width: 100px;
+        height: 50px;
+        object-fit: cover;
+      }
+    }
+
+    .search-wrap {
+      margin-top: 20px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      .search-bar {
+        width: 90%;
+        display: flex;
+        align-items: center;
+        background-color: #FFFFFF; // 黄色背景
+        border-radius: 50px;
+        padding: 10px;
+        .search-icon {
+          margin: 0 20px;
+        }
+  
+        .search-input {
+          flex: 1;
+          border: none;
+          outline: none;
+          background-color: transparent;
+        }
+  
+        .search-button {
+          border: 1px solid #7D807E;
+          border-radius: 50px;
+          padding: 5px 20px;
+        }
+      }
+
+    }
+  }
+}

src/pages/member/index.config.js

@@ -0,0 +1,3 @@
+export default definePageConfig({
+  navigationBarTitleText: '会员'
+})

src/pages/member/index.jsx

@@ -0,0 +1,24 @@
+import { Component } from 'react'
+import { View, Text } from '@tarojs/components'
+import './index.less'
+
+export default class Index extends Component {
+
+  componentWillMount () { }
+
+  componentDidMount () { }
+
+  componentWillUnmount () { }
+
+  componentDidShow () { }
+
+  componentDidHide () { }
+
+  render () {
+    return (
+      <View className='index'>
+        <Text>会员</Text>
+      </View>
+    )
+  }
+}

src/pages/mine/index.config.js

@@ -0,0 +1,3 @@
+export default definePageConfig({
+  navigationBarTitleText: '我的'
+})

src/pages/mine/index.jsx

@@ -0,0 +1,24 @@
+import { Component } from 'react'
+import { View, Text } from '@tarojs/components'
+import './index.less'
+
+export default class Index extends Component {
+
+  componentWillMount () { }
+
+  componentDidMount () { }
+
+  componentWillUnmount () { }
+
+  componentDidShow () { }
+
+  componentDidHide () { }
+
+  render () {
+    return (
+      <View className='index'>
+        <Text>我的</Text>
+      </View>
+    )
+  }
+}

src/service/index.js

@@ -0,0 +1,19 @@
+//接口集成
+import Request from '../api/request';
+
+//接口请求
+export const login = data =>
+  Request({
+    url: '/api/login',
+    method: 'POST',
+    data,
+  });
+
+
+
+
+
+
+
+
+

types/global.d.ts

@@ -0,0 +1,19 @@
+/// <reference types="@tarojs/taro" />
+
+declare module '*.png';
+declare module '*.gif';
+declare module '*.jpg';
+declare module '*.jpeg';
+declare module '*.svg';
+declare module '*.css';
+declare module '*.less';
+declare module '*.scss';
+declare module '*.sass';
+declare module '*.styl';
+
+declare namespace NodeJS {
+  interface ProcessEnv {
+    TARO_ENV: 'weapp' | 'swan' | 'alipay' | 'h5' | 'rn' | 'tt' | 'quickapp' | 'qq' | 'jd'
+  }
+}
+