Sivo 悉见

cli 创建支持 vue3 的 uni-app 项目

匿名 · 更新于 2022/5/9

  1. 创建 Vue3/Vite 工程

    <pre style="box-sizing: border-box; overflow: auto; font-family: SFMono-Regular, Consolas, &quot;Liberation Mono&quot;, Menlo, Courier, monospace; font-size: 12px; padding: 16px; margin-top: 0px; margin-bottom: 16px; line-height: 1.45; word-break: break-all; overflow-wrap: normal; color: rgb(51, 51, 51); background-color: rgb(246, 248, 250); border: 1px solid rgb(204, 204, 204); border-radius: 3px;">
    

    复制代码# 创建以 javascript 开发的工程 npx degit dcloudio/uni-preset-vue#vite my-vue3-project

    # 创建以 typescript 开发的工程 npx degit dcloudio/uni-preset-vue#vite-ts my-vue3-project

  2. 进入工程目录

    <pre style="box-sizing: border-box; overflow: auto; font-family: SFMono-Regular, Consolas, &quot;Liberation Mono&quot;, Menlo, Courier, monospace; font-size: 12px; padding: 16px; margin-top: 0px; margin-bottom: 16px; line-height: 1.45; word-break: break-all; overflow-wrap: normal; color: rgb(51, 51, 51); background-color: rgb(246, 248, 250); border: 1px solid rgb(204, 204, 204); border-radius: 3px;">
    

    复制代码cd my-vue3-project

  3. 安装依赖

    <pre style="box-sizing: border-box; overflow: auto; font-family: SFMono-Regular, Consolas, &quot;Liberation Mono&quot;, Menlo, Courier, monospace; font-size: 12px; padding: 16px; margin-top: 0px; margin-bottom: 16px; line-height: 1.45; word-break: break-all; overflow-wrap: normal; color: rgb(51, 51, 51); background-color: rgb(246, 248, 250); border: 1px solid rgb(204, 204, 204); border-radius: 3px;">
    

    复制代码npm i 或 yarn

  4. 运行

    <pre style="box-sizing: border-box; overflow: auto; font-family: SFMono-Regular, Consolas, &quot;Liberation Mono&quot;, Menlo, Courier, monospace; font-size: 12px; padding: 16px; margin-top: 0px; margin-bottom: 16px; line-height: 1.45; word-break: break-all; overflow-wrap: normal; color: rgb(51, 51, 51); background-color: rgb(246, 248, 250); border: 1px solid rgb(204, 204, 204); border-radius: 3px;">
    

    复制代码# 运行到 h5 npm run dev:h5
    # 运行到 app npm run dev:app
    # 运行到 微信小程序 npm run dev:mp-weixin

  5. 打包

    <pre style="box-sizing: border-box; overflow: auto; font-family: SFMono-Regular, Consolas, &quot;Liberation Mono&quot;, Menlo, Courier, monospace; font-size: 12px; padding: 16px; margin-top: 0px; margin-bottom: 16px; line-height: 1.45; word-break: break-all; overflow-wrap: normal; color: rgb(51, 51, 51); background-color: rgb(246, 248, 250); border: 1px solid rgb(204, 204, 204); border-radius: 3px;">
    

    复制代码# 打包到 h5 npm run build:h5
    # 打包到 app npm run build:app
    # 打包到 微信小程序 npm run build:mp-weixin