taro 微信小程序 vscode 简单使用

大致参考taro 3.x --> 安装及使用 ->渐进式入门教程，
安装taro参考之前的文章

vue3的组合式api

我这里使用vscode,推荐安装 ESLint 插件，因为使用Vue推荐安装 Vetur 插件。
error_books

创建项目

在创建完项目之后，Taro 会默认开始安装项目所需要的依赖，安装使用的工具按照 yarn > cnpm > npm 顺序进行检测。一般来说，依赖安装会比较顺利，但某些情况下可能会安装失败，这时候你可以在项目目录下自己使用安装命令进行安装：

 npm install

入口组件

每一个 Taro 项目都有一个入口组件和一个入口配置，我们可以在入口组件中设置全局状态/全局生命周期
src/app.js
入口主键配置文件
src/app.config.js,可以在全局配置文件中设置页面组件的路径、全局窗口、路由等信息

页面组件

页面组件是每一项路由将会渲染的页面，Taro 的页面默认放在 src/pages 中，每一个 Taro 项目至少有一个页面组件
View 组件。这是来源于 @tarojs/components 的跨平台组件

微信小程序，选择创建项目目录

博客图片目录
20241118135312.png

运编译运行

我这边使用微信小程序，以微信小程序为例：

 npm run dev:weapp
 npm run build:weapp

Taro 编译分为 dev 和 build 模式：

  • dev 模式（增加 --watch 参数） 将会监听文件修改。
  • build 模式（去掉 --watch 参数） 将不会监听文件修改，并会对代码进行压缩打包。
  • dev 模式生成的文件较大，设置环境变量 NODE_ENV 为 production 可以开启压缩，方便预览，但编译速度会下降。