商城建网站,网络规划设计师的成就,微信内部劵网站怎么做,唐山网站建设方案书更多ruoyi-nbcio功能请看演示系统
gitee源代码地址
前后端代码#xff1a; https://gitee.com/nbacheng/ruoyi-nbcio
演示地址#xff1a; http://122.227.135.243:9666
更多nbcio-boot功能请看演示系统
gitee源代码地址
后端代码#xff1a; https://gitee.com/nbach…更多ruoyi-nbcio功能请看演示系统
gitee源代码地址
前后端代码 https://gitee.com/nbacheng/ruoyi-nbcio
演示地址 http://122.227.135.243:9666
更多nbcio-boot功能请看演示系统
gitee源代码地址
后端代码 https://gitee.com/nbacheng/nbcio-boot
前端代码https://gitee.com/nbacheng/nbcio-vue.git
在线演示包括H5 http://122.227.135.243:9888
1、运行出现下面警告
出现警告 The CJS build of Vite‘s Node API is deprecated.
解决办法可以在
package.json 添加 type: module
2、出现下面的错误
ReferenceError: defineOptions is not defined
好像不支持defineOptions
vue3 defineOptions使用需要注意 项目推荐依赖
vue^3.3
volar / vue-tsc^1.6.4
vite^4.3.5
vitejs/plugin-vue^4.2.0
vue-loader^17.1.0 (if using webpack or vue-cli)
所以有些组件需要进行升级
3、出现下面错误
No known conditions for ./lib/locale/lang/zh-cn specifier in element-plus package
import locale from element-plus/lib/locale/lang/zh-cn; // 中文语言
上面修改成如下
import locale from element-plus/es/locale/lang/zh-cn; // 中文语言
4、主页显示charts图的时候出现下面错误
Vue warn]: Failed to resolve component: BarChart
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. at Dashboard onVnodeUnmountedfnonVnodeUnmounted refRef undefined key/index at KeepAlive include [] at BaseTransition modeout-in appearfalse persistedfalse ... at Transition enter-active-classanimate__animated animate__fadeIn modeout-in at RouterView at AppMain at Index onVnodeUnmountedfnonVnodeUnmounted refRef null at RouterView at ElConfigProvider locale {name: zh-cn, el: {…}}el: {colorpicker: {…}, datepicker: {…}, select: {…}, cascader: {…}, pagination: {…}, …}name: zh-cn[[Prototype]]: Object sizedefault at App
变成显示如下了 5、需要在vite.config.ts引入下面包因为是用unplugin-vue-components 是由 Vue官方人员开发的一款自动引入插件可以省去比如 UI 库的大量 import 语句
import vue from vitejs/plugin-vue;
import { UserConfig, ConfigEnv, loadEnv, defineConfig } from vite;import AutoImport from unplugin-auto-import/vite;
import Components from unplugin-vue-components/vite;
import { ElementPlusResolver } from unplugin-vue-components/resolvers;import Icons from unplugin-icons/vite;
import IconsResolver from unplugin-icons/resolver;import { createSvgIconsPlugin } from vite-plugin-svg-icons;
import vueJsx from vitejs/plugin-vue-jsx;import UnoCSS from unocss/vite;
import { resolve } from path;
const pathSrc resolve(__dirname, src);
plugins: [vue(),// MOCK 服务开启 MOCK 放开注释即可// mockDevServerPlugin(),vueJsx(),UnoCSS({hmrTopLevelAwait: false,}),// 自动导入参考 https://github.com/sxzz/element-plus-best-practices/blob/main/vite.config.tsAutoImport({// 自动导入 Vue 相关函数如ref, reactive, toRef 等imports: [vue, vueuse/core, pinia, vue-router, vue-i18n],// 自动导入 Element Plus 相关函数如ElMessage, ElMessageBox... (带样式)resolvers: [ElementPlusResolver(), IconsResolver({})],eslintrc: {enabled: false,filepath: ./.eslintrc-auto-import.json,globalsPropValue: true,},vueTemplate: true,// 配置文件生成位置(false:关闭自动生成)dts: false,// dts: src/typings/auto-imports.d.ts,}),Components({resolvers: [// 自动导入 Element Plus 组件ElementPlusResolver(),// 自动注册图标组件IconsResolver({ enabledCollections: [ep] }),],// 指定自定义组件位置(默认:src/components)dirs: [src/components, src/**/components],// 配置文件位置 (false:关闭自动生成)dts: false,// dts: src/typings/components.d.ts,}),Icons({autoInstall: true,}),createSvgIconsPlugin({// 指定需要缓存的图标文件夹iconDirs: [resolve(pathSrc, assets/icons)],// 指定symbolId格式symbolId: icon-[dir]-[name],}),],
6、重新运行后出现下面界面了
