dcloudio/uni-preset-vue

uni-app preset for vue

@uni-app/vue-cli-preset-uni-app

uni-app preset for vue-cli

uni-preset-vue's Issues

TypeScript不支持装饰器

在TypeScript模板项目中使用装饰器，编译不通过

<script lang="ts">
import Vue from 'vue'
import Component from 'vue-class-component'

@Component
export default class App extends Vue {
  mpType = 'app'
}
// import Vue from 'vue';
// export default Vue.extend({
//     mpType: 'app',
//     onLaunch() {
//         console.log('App Launch')
//     },
//     onShow() {
//         console.log('App Show')
//     },
//     onHide() {
//         console.log('App Hide')
//     }
// });
</script>

错误信息如下：

image 组件的 mode 的 heightFix 没有效果

heightFix 用 hbuilderx 编译可以自动适应宽度，用cli 不可以。

导入vue3-typescript模板报错

vite-ts分支，编译到微信小程序平台后，微信开发者工具模拟器里appData数据是混淆的

• 分支： vite-ts
• 平台： 微信小程序
• 问题： 微信开发者工具-调试器-AppData 数据不对，如下图。

vite+ts 编译v-text报错

想问下这个模板怎么添加windicss

想问下这个模板怎么添加windicss

vue-cli命令行安装自定义模版出现问题

问题描述
vue-cli安装脚手架，使用自定义模版 - uView，针对启动打包H5，启动以及打包的时候，都报 Failed to resolve loader: sass-loader；

预期结果
预期遍历安装，可以启动以及打包

实际结果
报错，无法安装 uView-ui 这个自定义模版下的依赖

补充信息
应该是在脚手架里直接引入 uView-ui 自定义模版，而该模版下的依赖无法在脚手架下直接安装导致的

Error: Cannot find module 'webpack/lib/RuleSet'

测试版和正式版出很久了。为什么还不支持5.0?
5.0.0-alpha.0 (2020-12-14)
5.0.0 (2022-02-17)

vue-cli创建了uniapp项目不能使用自己安装的vue和vuex版本吗，还是要用 hbuilder 自带的吗

app里面的组件都是英文版的

用hbuilder创建的项目没问题，但是用cli创建的项目里面的比如picker组件显示的是cancel done英文版的
h5端没问题，app端显示英文版的

TS模板 h5端无法加载sourcemap

DevTools 无法加载 SourceMap： 无法加载 的内容HTTP 错误：状态代码 404，net::ERR_HTTP_RESPONSE_CODE_FAILURE

设置环境变量

请问一下，uni-app 通过vue-cli创建的vue3.0项目怎么设置环境变量呢？
之前在运行或者打包脚本添加cross-env NODE_ENV=test UNI_PLATFORM=mp-weixin vue-cli-service uni-build就可以传入环境变量，现在咋都不行，cross-env NODE_ENV=test VUE_APP_ENV=test uni build -p mp-weixin这样不行，用vue3的那种方式添加.env.test文件也不行

postcss配置失效

vite-ts分支

在3.0.0-alpha-3031120220208001以后的依赖版本，postcss配置失效了

支付宝点击事件无反应

编译支付宝时,页面正常显示,无报错,但是绑定事件点击不起作用

选择 Hello uni-app 模板生成项目失败

运行

vue create -p dcloudio/uni-preset-vue my-project

报错信息： ERROR TypeError: Cannot read property 'projectName' of undefined ，如下图

[vite:uni-mp-main-js] Unexpected token, expected "," (6:25)

拉取uni-preset-vue最新版vite分支代码，
"@dcloudio/uni-mp-weixin": "^3.0.0-alpha-3021320211119002",
provide的第二个参数内如果存在函数类型会报 [vite:uni-mp-main-js] Unexpected token, expected "," (6:25)
加入// @ts-ignore后正常

// main.ts
import { createSSRApp } from 'vue'
import App from './App.vue'
export function createApp() {
  const app = createSSRApp(App)
  app.provide('UseRequestConfigContext', {
      // @ts-ignore
    requestMethod: (param: any) => {},
  })
  return {
    app,
  }
}

HBuilderX mac M1编译 vite/vue3 cli项目时编译不了

解决方法: 此方法不受版本限制，请官方及时修改

重新安装依赖 将 node_modules/esbuild-darwin-arm64 修改为 esbuild-darwin-64

@vue/cli-plugin-babel 版本升级

现在模板里 @vue/cli-plugin-babel 的版本是 3.5.1，如果升级到 4.1.2 启动项目就会报错，该怎么改？

vite分支的代码，在编译成微信小程序后，小程序AppData调试下展示的数据都是（a、b...）

<script setup>
import { ref } from 'vue'
let title = ref('Hello World')
let color = ref('blue')
</script>

拉取vite-ts版本后，无法在微信小程序内运行

生成模板失败

D:\code\projects>vue create -p dcloudio/uni-preset-vue uni-app
Vue CLI v4.4.5
? Target directory D:\code\projects\uni-app already exists. Pick an action: Overwrite

Removing D:\code\projects\uni-app...
Fetching remote preset dcloudio/uni-preset-vue...


Vue CLI v4.4.5
✨  Creating project in D:\code\projects\uni-app.
�  Initializing git repository...
⚙️  Installing CLI plugins. This might take a while...

yarn install v1.22.4
info No lockfile found.
[1/4] Resolving packages...
[2/4] Fetching packages...
info [email protected]: The platform "win32" is incompatible with this module.
info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
info [email protected]: The platform "win32" is incompatible with this module.
info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...###############################################################################] 1063/1063
                                                                                                                        success Saved lockfile.
Done in 20.93s.
�  Invoking generators...

Preset options:
? 请选择 uni-app 模板 默认模板(TypeScript)
�  Installing additional dependencies...

yarn install v1.22.4
[1/4] Resolving packages...
[2/4] Fetching packages...
error https://registry.npm.taobao.org/@types/istanbul-lib-report/download/@types/istanbul-lib-report-3.0.0.tgz?cache=0&sync_timestamp=1588204387374&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40types%2Fistanbul-lib-report%2Fdownload%2F%40types%2Fistanbul-lib-report-3.0.0.tgz: Integrity check failed for "@types/istanbul-lib-report" (computed integrity doesn't match our records, got "sha512-wcdi+uAKzfiGT2abPpKZ0hSU1rGQjUQnLvtY5MpQ7QCTahD3VODhcu4wcfY1YtkGaDD5yuydOLINXsfbus9ROw== sha1-dRj+UupE3jcvRgp2tezan/tz2KY=")
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
 ERROR  command failed: yarn

有办法离线使用模板么？

部分类型声明不正确

string就别定义2遍了，where是可以传递Record<string, unknown>

cloud.d.ts

另外亚琪哥你们这个类型怎么自定义啊，虽然是工具生成的type，而且不能提交pr，我们开发者只能自己定义了。

我自己定义其他一些模块还可以，这个type模块真的把我搞懵了，层级太多了。我微信就不找你了，现在时间太晚了。

[Vue warn]: Failed to resolve component: uni-nav-bar

vite-ts 版本 app端引入uni-ui出错 h5端正常

Cannot find module webpack

node v12.22.12
@vue/cli 5.0.4

配置postcss.config.js 无效

安装tailwindcss

考虑把这个项目打成npm包吗

这样可以做一个 基于这个preset的 内部preset，想拿到generator和template的内容

初始化 vue3 ts 模板无法正常启动

vue create -p dcloudio/uni-preset-vue#vue3 uniapp-vue3


npm run serve 报错

vite 版本 resolve alias 失效

vite 版本 resolve alias 失效
在vite.config 配置了

resolve: {
  alias: {
    '@': path.resolve(__dirname, 'src')
  }
}

用@引用模块是就报错
[plugin:vite:load-fallback] Could not load

使用 vue create -p dcloudio/uni-preset-vue proj 长时间没有完成

通过命令 vue create -p dcloudio/uni-preset-vue 创建项目时长时间没有完成.
猜测 是git 存储库中包含 node_modules, 导致下载时间过长.
不过也没有看到错误信息或日志,无法查明原因.

版本不一致

使用cli创建的uni-app项目，选的是typescript模板，然后使用hbuilder3.23 运行在手机上，就提示了 版本不一致的弹窗：本应用使用HBuilderX3.2.2或对应的cli版本编译，而手机端SDK版本是3.2.3.

我更新了 vue/cli,并且重新create了一个 uniapp 项目，还是会出现这个弹窗

uni-preset-vue#vite 安装会失败了,怎么解决

npx degit dcloudio/uni-preset-vue#vite my-vue3-project

> cloned dcloudio/uni-preset-vue#vite to my-vue3-project

npm install

npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/@dcloudio%2funi-uts-vite - Not found
npm ERR! 404 
npm ERR! 404  '@dcloudio/[email protected]' is not in this registry.
npm ERR! 404 
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/test/.npm/_logs/2022-08-01T16_26_44_978Z-debug-0.log

使用npm 创建项目, 报错了, 网上搜索, 自己看看代码, 没找到怎么解决这个问题.

能不能tag一下跟hbx对应的版本

能不能tag一下跟hbx对应的版本，不然npm update 一升级就没有合适版本的基座调试了

uni-ui无法使用

使用此模板创建的项目，uni-ui组件无法使用。没有任何报错。但是自定义的组件是可以使用的。

如何通过 vue.config.js 自定义 webpack的一些流程

我通过 cli 创建 uni-app ，使用的是这个项目模板，我尝试自定义 vue.config.js 文件
但是好像没有解析。（vue.config.js 配置的内容在 其他vue-cli3创建的项目中可以正常使用，排除自己不会配置vue-cli3 的 vue.config.js文件，只是问问，在 uni-app项目里如何才能生效）

vite-ts cli项目 运行H5开发环境使用hybrid目录无法找到路径

目录结构

src
┣ hybrid
┃ ┗ html
┃   ┗ local.html
┣ pages
┃ ┣ index
┃ ┃ ┗ index.vue
┃ ┗ webview
┃   ┣ index.vue
┃   ┗ local.vue
┣ static
┃ ┗ logo.png
┣ App.vue
┣ env.d.ts
┣ main.ts
┣ manifest.json
┣ pages.json
┗ uni.scss

local.vue

<template>
  <view>
    <web-view src="/hybrid/html/local.html"></web-view>
  </view>
</template>

运行yarn dev:h5开发环境，访问/pages/webview/local控制台报错
[Error] Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:3000/hybrid/html/local.html

运行在app或者打包正式环境运行，一切可以正常显示

vite-ts模版提个建议

uniapp类型@dcloudio/types从tsconfig.json的types放到env.d.ts里；

// env.d.ts 文件

/// <reference types="vite/client" />
/// <reference types="@dcloudio/types" />

原因：指定types配置，失去了ts自动包含@types里的所有包的特性，导致使用其他包声明（如lodash、express）都得在types里配置

如何更改编译器版本

vue create -p dcloudio/uni-preset-vue xxx后报错 ERROR TypeError: Cannot convert undefined or null to object

vue create -p dcloudio/uni-preset-vue xxx
安装了官方推荐的webpack4之后
npm run dev:h5
就会报错ERROR TypeError: Cannot convert undefined or null to object

Error: Cannot find module '@dcloudio\uni-app-plus\lib\uni.plugin.js'

2.0.1-alpha-35120220706001

unplugin-auto-import/vite插件失效

用vite官方脚手架没有问题

拉取uni-preset-vue最新版vite分支代码，
"@dcloudio/uni-h5": "^3.0.0-alpha-3021320211119002",
"@dcloudio/uni-mp-weixin": "^3.0.0-alpha-3021320211119002",
安装AutoImport

// 页面代码
// 放开注释后正常
<script lang="ts">
// import { ref } from 'vue'
export default {
  setup() {
    const title = ref('Hello')
    return {
      title,
    }
  }
}
</script>

// vite.config.ts
import { defineConfig } from 'vite'
import uni from '@dcloudio/vite-plugin-uni'
import AutoImport from 'unplugin-auto-import/vite'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    uni(),
    AutoImport({
      /* options */
      imports: ['vue'],
      dts: 'src/auto-imports.d.ts',
    }),
  ],
})

报错

client.ts:22 [vite] connecting...
client.ts:52 [vite] connected.
App.vue:4 App Launch
App.vue:7 App Show
uni-h5.es.js:13934 [Vue warn]: Unhandled error during execution of setup functionundefined 
 at <Index>
at <AsyncComponentWrapper>
at <PageBody>
at <Page>
at <Anonymous>
at <Layout>
at <App>
warnHandler @ uni-h5.es.js:13934
uni-h5.es.js:13934 [Vue warn]: Unhandled error during execution of scheduler flush. This is likely a Vue internals bug. Please open an issue at https://new-issue.vuejs.org/?repo=vuejs/vue-nextundefined 
 at <Index>
at <AsyncComponentWrapper>
at <PageBody>
at <Page>
at <Anonymous>
at <Layout>
at <App>
warnHandler @ uni-h5.es.js:13934
index.vue:14 Uncaught (in promise) ReferenceError: ref is not defined
    at setup (index.vue:14)
    at comp.setup (uni-h5.es.js:13955)
    at callWithErrorHandling (vue.runtime.esm.js:7921)
    at setupStatefulComponent (vue.runtime.esm.js:7528)
    at setupComponent (vue.runtime.esm.js:7484)
    at mountComponent (vue.runtime.esm.js:5330)
    at processComponent (vue.runtime.esm.js:5305)
    at patch (vue.runtime.esm.js:4894)
    at ReactiveEffect.componentUpdateFn [as fn] (vue.runtime.esm.js:5519)
    at ReactiveEffect.run (vue.runtime.esm.js:162)
DevTools failed to load source map: Could not load content for chrome-extension://dipiagiiohfljcicegpgffpbnjmgjcnf/js/commons.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
DevTools failed to load source map: Could not load content for chrome-extension://dipiagiiohfljcicegpgffpbnjmgjcnf/js/react.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
DevTools failed to load source map: Could not load content for chrome-extension://dipiagiiohfljcicegpgffpbnjmgjcnf/js/content.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
App.vue:10 App Hide
App.vue:7 App Show

TypeError: this.getOptions is not a function

vue create -p dcloudio/uni-preset-vue uni-app
npm i @dcloudio/uni-ui --save
npm i sass -D
npm i sass-loader -D

// index.vue
<template>
  <view class="content">
    <uni-list>
      <uni-list-item v-for="(account, index) in accounts" :key="index" :note="account.nickname"/>
    </uni-list>
  </view>
</template>

<script>
import { uniList } from '@dcloudio/uni-ui'
export default {
  components: { uniList },
  data() {
    return {
      accounts: []
    }
  },
  onLoad() {
    this.getAccounts()
  },
  methods: {
    getAccounts(){
      this.accounts = [{ nickname: 1, nickname: 2, nickname: 3, }]
    }
  }
}
</script>

<style>
....
</style>

错误信息:

 ERROR  Failed to compile with 1 error                                                                                                                                 下午3:50:09

 error  in ./node_modules/@dcloudio/uni-ui/lib/uni-list/uni-list.vue?vue&type=style&index=0&lang=scss&

TypeError: this.getOptions is not a function
    at runMicrotasks (<anonymous>)


 @ ./node_modules/@dcloudio/uni-ui/lib/uni-list/uni-list.vue?vue&type=style&index=0&lang=scss& 1:0-747 1:763-766 1:768-1512 1:768-1512
 @ ./node_modules/@dcloudio/uni-ui/lib/uni-list/uni-list.vue
 @ ./node_modules/babel-loader/lib!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--12-1!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./src/pages/index/index.vue?vue&type=script&lang=js&
 @ ./src/pages/index/index.vue?vue&type=script&lang=js&
 @ ./src/pages/index/index.vue
 @ ./src/main.js?{"page":"pages%2Findex%2Findex"}

使用vue-cli 建立模板项目失败

Vue CLI v3.7.0
✨  Creating project in /Users/xx/cat/Project/xx.
🗃  Initializing git repository...
⚙  Installing CLI plugins. This might take a while...

yarn install v1.15.2
info No lockfile found.
[1/4] 🔍  Resolving packages...
⠄ rc@^1.0.1(node:96182) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 drain
 listeners added to [TLSSocket]. Use emitter.setMaxListeners() to increase limit
⠄ which@^1.2.9(node:96182) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 dr
ain listeners added to [TLSSocket]. Use emitter.setMaxListeners() to increase limit
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
error Couldn't find package "copy-webpack-plugin@^4.6.0" required by "@dcloudio/vue-cli-plugin-uni@^2.0.0
-22420190823018" on the "npm" registry.
 ERROR  command failed: yarn 

vue create -p dcloudio/uni-preset-vue 无法使用了

之前是慢但是不报错啊，现在根本没反应了

PS D:\SourceCodes\1test\uniapp> vue create -p dcloudio/uni-preset-vue my-project \ Fetching remote preset dcloudio/uni-preset-vue...

在vscode 中，使用【vue create -p dcloudio/uni-preset-vue my-project】 命令创建 typescript 默认模板，最后运行报错

为什么是 new App()

关于分包的问题，使用分支为vite-ts

使用vite-ts分支。

项目包含两个分包main和wasm。

main为主包。

wasm为子包。

通过yarn add引入一个很大的依赖，然后将此依赖封装成一个.ts工具放入wasm的lib文件夹下，且此工具类只在wasm包中引用过

manifest.json也配置了

"optimization" : { "subPackages" : true }

但是执行 yarn dev:mp-weixin 后，结果如下，vendor.js文件并没有分包。

启动时自动安装真机测试

RT，注意到用cli模式运行APP，仅仅只是在dev目录下进行打包了源代码，并没有启动真机或者模拟器APP，求cli的解决方案。
其次HBuilder中打开项目，提示错误：

17:34:39.981 failed to load config from /Users/wanyun/easement/mini/vite.config.js
17:34:39.984 error during build:
17:34:39.986 Error: 
17:34:39.986 You installed esbuild on another platform than the one you're currently using.
17:34:39.988 This won't work because esbuild is written with native code and needs to
17:34:39.990 install a platform-specific binary executable.
17:34:39.992 Specifically the "esbuild-darwin-arm64" package is present but this platform
17:34:39.992 needs the "esbuild-darwin-64" package instead. People often get into this
17:34:39.994 situation by installing esbuild on Windows or macOS and copying "node_modules"
17:34:39.996 into a Docker image that runs Linux, or by copying "node_modules" between
17:34:39.997 Windows and WSL environments.
17:34:39.998 If you are installing with npm, you can try not copying the "node_modules"
17:34:40.000 directory when you copy the files over, and running "npm ci" or "npm install"
17:34:40.001 on the destination platform after the copy. Or you could consider using yarn
17:34:40.003 instead which has built-in support for installing a package on multiple
17:34:40.003 platforms simultaneously.
17:34:40.005 If you are installing with yarn, you can try listing both this platform and the
17:34:40.007 other platform in your ".yarnrc.yml" file using the "supportedArchitectures"
17:34:40.008 feature: https://yarnpkg.com/configuration/yarnrc/#supportedArchitectures
17:34:40.009 Keep in mind that this means multiple copies of esbuild will be present.
17:34:40.010 Another alternative is to use the "esbuild-wasm" package instead, which works
17:34:40.012 the same way on all platforms. But it comes with a heavy performance cost and
17:34:40.012 can sometimes be 10x slower than the "esbuild" package, so you may also not

然而我运行 npm i esbuild-darwin-arm64，HBuilder也是不行的。

vite-ts cli项目开发环境启用代码压缩报错

操作步骤
按官网教程创建Vue3/Vite-ts版，
运行 npm run dev:mp-weixin --minify
报错

/Workspace/my-vue3-project/node_modules/cac/dist/index.js:404
          throw new CACError(`Unknown option \`${name.length > 1 ? `--${name}` : `-${name}`}\``);
Error: Unknown option `--minify`

创建hello uniapp后报sass-loader错误

Syntax Error: ValidationError: Invalid options object. Sass Loader has been 怎么解决呀，安装了其他版本的sass-loader还是有问题

安装Hello Uniapp模版时出错

控制台报错如下：

gyp ERR! stack Error: Command failed: /usr/local/bin/python -c import sys; print "%s.%s.%s" % sys.version_info[:3];
gyp ERR! stack   File "<string>", line 1
gyp ERR! stack     import sys; print "%s.%s.%s" % sys.version_info[:3];
gyp ERR! stack                 ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
gyp ERR! stack SyntaxError: Missing parentheses in call to 'print'. Did you mean print(...)?
gyp ERR! stack 
gyp ERR! stack     at ChildProcess.exithandler (node:child_process:397:12)
gyp ERR! stack     at ChildProcess.emit (node:events:390:28)
gyp ERR! stack     at maybeClose (node:internal/child_process:1062:16)
gyp ERR! stack     at Socket.<anonymous> (node:internal/child_process:448:11)
gyp ERR! stack     at Socket.emit (node:events:390:28)
gyp ERR! stack     at Pipe.<anonymous> (node:net:687:12)
gyp ERR! System Darwin 21.4.0
gyp ERR! command "/usr/local/Cellar/node/17.3.0/bin/node" "/Users/me/Workspace/android/hello-uniapp/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
gyp ERR! cwd /Users/vorbote/Workspace/android/hello-uniapp/node_modules/node-sass
gyp ERR! node -v v17.3.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok 
Build failed with error code: 1

看报告推断是因为macOS 12系统移除了python2导致无法执行Python2的命令导致，建议官方引入新版本或者在原作者的版本上进行修改

vue create -p dcloudio/uni-preset-vue 能否创建对应HBuilder 版本的资源

需求来源：老项目是通过HBuilder 创建的，现在想改成vue-cli方式来管理项目，但是通过vue create -p dcloudio/uni-preset-vue创建默认是下载最新版本，所依赖的包都是最新(v2.8)的版本的包，我想通过改package.json版本进行修改，但是之前通过HBuilder创建的项目没有package.json文件，请教这个该怎么处理
解决思路：
1、提供HBuilder 版本对应的资源包版本
2、dcloudio/uni-preset-vue提供一个参数可以选择对应HBuilder 版本进行创建项目