Getting Started Tutorial
Official website
Install SCSS/SASS compilation plugin and import
Installation address: https://ext.dcloud.net.cn/search?q=sass
Then you can start building the project
Project construction
tool
HbuilderX：https://dcloud.io/hbuilderx.html
Create project
Click Create to create success
Project structure
Configure and develop WeChat applet
[Step 1:] Configure the WeChat developer tool path
Tools -> Settings -> Run Configurations
[Step 2:] Configure the AppID corresponding to the WeChat applet
manifest.json—"WeChat applet configuration
[Step 3:] Open the WeChat applet service port (in the WeChat developer tool)
Settings -> Security Settings
[Step 4:] Implement the case and run the project
Create page
Choose to use scss page
to create 4 pages, cart, cate, home, my
Create icon file
Put it under static static resources
configure pages.json
{
"pages": [{
"path": "pages/home/home",
"style": {
"navigationBarTitleText": "uni-app"
}
} ,{
"path" : "pages/cart/cart",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
,{
"path" : "pages/cate/cate",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
,{
"path" : "pages/my/my",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
],
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8",
"app-plus": {
"background": "#efeff4"
}
},
"tabBar": {
"list": [
{
"pagePath": "pages/home/home",
"text": "首页",
"iconPath": "static/icons/home.png",
"selectedIconPath": "static/icons/home-o.png"
},
{
"pagePath": "pages/cate/cate",
"text": "分类",
"iconPath": "static/icons/category.png",
"selectedIconPath": "static/icons/category-o.png"
},
{
"pagePath": "pages/cart/cart",
"text": "购物车",
"iconPath": "static/icons/cart.png",
"selectedIconPath": "static/icons/cart-o.png"
},
{
"pagePath": "pages/my/my",
"text": "我的",
"iconPath": "static/icons/my.png",
"selectedIconPath": "static/icons/my-o.png"
}
]
}
}
run
run successfully~