![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Web前端实践笔记
专门用于记录在前端实践时的出现的一些疑问及其解决方法。
前端花卷
每天进步一点点!
展开
-
vue3+vite5,引入tailwindcss不生效的原因
新版本的vite不需要创建scss样式文件,直接在main.js中导入import "tailwindcss/tailwind.css";另外,对于vite4及以上版本,vite.config.js不需要对tailwind做任何配置,postcss插件vite内部会自动引入进行运行。在App.vue,将img标签的class设置为class='bg-red-900'和class='bg-orange-600'若页面中出现如下红色和橙色背景,则表示tailwindcss引入成功。原创 2024-05-16 15:58:27 · 996 阅读 · 0 评论 -
vue报错之“ Static class blocks are not enabled. Please add `@babel/plugin-transform-class-static-block”
这个报错信息提示的是静态类块(因为在JavaScript中使用了类语法,但没有相应的Babel插件来转换这种高级语法特性)不被支持。因为Babel默认只转换ES5语法,所以需要添加对应的Babel插件来实现转换。2. 在Babel配置文件(比如。3.重新运行项目,问题解决。原创 2024-04-21 17:13:31 · 472 阅读 · 0 评论 -
vue报错之“JSX element implicitly has type ‘any‘ because no interface ‘JSX.IntrinsicElements‘ exists.”
在使用TypeScript时,在vue中报了如上错误,“JSX 元素隐式具有类型 "any",因为不存在全局类型 "JSX.Element"。不使用严格的类型检查,即在 tsconfig.json 中设置 “strict”: false。在 tsconfig.json中设置 “noImplicitThis”: false。原创 2024-04-19 20:11:42 · 2071 阅读 · 1 评论 -
vue报错之“Feature flag __VUE_PROD_HYDRATION_MISMATCH_DETAILS__ is not explicitly defined... ”
然而,启用 __VUE_PROD_HYDRATION_MISMATCH_DETAILS__ 标志后,即使在生产环境下,当发生hydration不匹配错误时,Vue也会输出详细的错误信息,这对于调试和排查此类问题非常有用。在Vue 3.4版本中引入了特性标志__VUE_PROD_HYDRATION_MISMATCH_DETAILS__,是一个编译时的特征标志(feature flag),它用于控制在生产环境下服务器端渲染(SSR)过程中hydration(激活)阶段的错误处理行为。原创 2024-04-19 19:58:33 · 3166 阅读 · 3 评论 -
使用create-vite创建项目后,默认vue文件里面引用vue的地方报错
报错信息如下:Cannot find module 'vue'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option?原创 2024-04-06 17:23:18 · 193 阅读 · 1 评论 -
vue3 动态引入图片时报错之“require is not defined”
在vue3中使用require引入img时,发现控制台报错“require is not defined”。因为vue3项目使用vite创建的,而require是webpack提供的一种加载能力。使用new URL(url, import.meta.url).href的格式引入图片。直接使用import引用该图片路径。原创 2024-02-02 23:14:00 · 1166 阅读 · 0 评论 -
vite创建项目后报错之“HelloWorld.vue has no default export”
使得写法为 lang=ts 的组件能使用 *.vue 引入。代替 Vetur 的语法高亮等功能。插件,Vetur 默认使用。原创 2024-01-31 21:47:10 · 1194 阅读 · 1 评论 -
npm install 报错 之 “certificate has expired”
我在下载vue/babel-plugin-jsx时,突然发现无法下载,控制报错显示:'certificate has expired'。查找原因后发现是‘证书过期'。然后执行以下命令,问题解决。原创 2024-01-27 14:18:20 · 4585 阅读 · 0 评论 -
Vue: 解决 “ESLint 的 Delete `CR`“报错
安装完prettier代码格式化工具 和 eslint 之后,在将git分支合并到主分支master时,eslint检测出了错误,全面爆红,导致项目无法启动。查找原因后发现是,在Prettier 和 Eslint 结合使用的情况下,代码运行后产生了 crlf 和 cr 差别,所以eslint 检测出来后无法启动以及全面爆红。1. 在终端修改 git 的全局配置,禁止 git 自动 将 lf 转换为 crlf。主要原因是 git 的 一个配置属性 core.autorlf。原创 2024-01-25 14:05:55 · 1061 阅读 · 0 评论 -
vite 报错之 Dynamic require of “path“ is not supported
vite 报错之 Dynamic require of "path" is not supported原创 2023-11-25 16:54:46 · 286 阅读 · 0 评论 -
Git使用之(error: pathspec ‘master‘ did not match any file(s) known to git)
Git使用之(error: pathspec 'master' did not match any file(s) known to git)原创 2023-11-20 19:46:27 · 603 阅读 · 1 评论