Pequeño programa para aprender el combate real del comercio electrónico pequeños proyectos (1) -construcción y preparación de marcos

herramientas de desarrollo

vscode + herramienta de desarrollo de subprogramas +
complementos de vscode de administración de git :

Suplemento: tecla de acceso directo de vscode:
https://blog.csdn.net/padluo/article/details/105153420

Construcción del marco

1. Cree varias carpetas


2. Elimine archivos predeterminados
como: página de registro, registros de app.js. predeterminados y otros contenidos de carpeta
3. Cree 13 páginas nuevas
frente a teclas de acceso directo: wx-app:

vs edición de columnas: Varias teclas de acceso directo:
ctrl + shift + alt + teclas de flecha: Ingrese la edición de la columna
ctrl + botón izquierdo, salte al final de la palabra (puede mantener presionada la tecla shfit si desea seleccionar)
ctrl + inicio / fin, saltar al final de la línea o al principio de la línea (si lo selecciona, puede mantener presionada la tecla shfit al mismo tiempo)
Consejos: preste atención a las palabras separadas con espacios para facilitar el procesamiento

4. Introduzca el icono de fuente iconfont



https://www.jianshu.com/p/17b5a1f12669
5. Configure 4 tabbar
app.json

{
    
    
  "pages":[
    "pages/index/index",
    "pages/category/category",
    "pages/goods_list/goods_list",
    "pages/goods_detail/goods_detail",
    "pages/cart/cart",
    "pages/collect/collect",
    "pages/order/order",
    "pages/search/search",
    "pages/user/user",
    "pages/feedback/feedback",
    "pages/login/login",
    "pages/auth/auth",
    "pages/pay/pay"
  ],
  "window":{
    
    
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "电商小项目",
    "navigationBarTextStyle":"black"
  },
  "tabBar": {
    
    
    "color": "#999",
    "selectedColor": "#ff2d4a",
    "backgroundColor": "#fafafa",
    "borderStyle": "black",
    "list": [
      {
    
    
      "pagePath": "pages/index/index",
      "text": "首页",
      "iconPath": "icons/home.png",
      "selectedIconPath": "icons/home-o.png"
    },
    {
    
    
      "pagePath": "pages/category/category",
      "text": "分类",
      "iconPath": "icons/category.png",
      "selectedIconPath": "icons/category-o.png"
    },
    {
    
    
      "pagePath": "pages/cart/cart",
      "text": "购物车",
      "iconPath": "icons/cart.png",
      "selectedIconPath": "icons/cart-o.png"
    },
    {
    
    
      "pagePath": "pages/user/user",
      "text": "我的",
      "iconPath": "icons/my.png",
      "selectedIconPath": "icons/my-o.png"
    }
  ]
  },
  "sitemapLocation": "sitemap.json"
}

El efecto de todas las operaciones anteriores es el siguiente:

dirección del código git:
https://github.com/hufanglei/pyg-demo/tree/day01

---

Terminar