vue3项目配置vite.config.ts中出现引入path模块错误问题

最新推荐文章于 2023-11-21 09:52:03 发布
最新推荐文章于 2023-11-21 09:52:03 发布
阅读量991 收藏 1
点赞数
分类专栏： typeScript vue 文章标签： vue typescript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_51938803/article/details/132082474
版权

vue3项目在vite.config.ts文件中配置alias别名时想要引入node的path模块，会报错。

一、错误

在这里插入图片描述

二、原因

path模块是node.js内置的功能，但是node.js本身并不支持ts

三、解决方案

安装@types/node

npm i @types/node -D
疯狂quickly
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue - vue.config.js中devServer配置方式
10-16
今天小编就为大家分享一篇vue - vue.config.js中devServer配置方式，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vite.config.ts 引入 `path` 模块注意点！
CSDN for recording problems
07-31 3683
在vite初始化项目搭建选择了TypeScript，那么避免不了有些ts类型检查提示错误，这里说说提示找不到模块“path”或其相应的类型声明。怎么解决。
vite+ts vite.config.ts使用path报错
yanhhhhhh的博客
05-23 4337
找不到模块path及其相应的声明 问题1：新项目配置vite.config.ts时使用import path from 'path' 原因分析：path模块是node.js内置的功能，但是node.js本身并不支持typescript，所以直接在typescript项目里使用是不行的 解决方案：安装@types/node 使用npm npm install @types/node --save-dev 使用pnpm pnpm i @types/node -D allowSyntheticDe
Vue3 安装与配置 详细教程
热门推荐
majingbobo的博客
10-28 1万+
Vue环境搭建及项目创建
vue3+vite项目中引入path模块报错
最新发布
2301_79313375的博客
11-21 1281
问题原因：vite 源码中设定了不允许在客户端代码中访问内置模块代码。2，使用 path-browserify 代替 path 模块。1，安装path-browserify。
关于vue3:vue3项目中配置viteconfigts时使用path模块报错
梨子社区
08-17 1900
创立vite我的项目的时候，在vite.confog.ts文件中增加alias别名时，想要引入node的path模块，会报错。起因：path模块是。
vite.config.ts配置
菠萝蜜
06-02 3689
vite.config.ts配置 vite 是一个基于 Vue3 单文件组件的非打包开发服务器，它做到了本地快速开发启动： 快速的冷启动，不需要等待打包操作； 即时的热模块更新，替换性能和模块数量的解耦让更新飞起； 真正的按需编译，不再等待整个应用编译完成，这是一个巨大的改变。
解决Vue-cli3没有vue.config.js文件夹及配置vue项目域名的问题
01-21
1.在vue项目根目录下新建vue.config.js（不是在src下面） vue.config.js配置文件： module.exports = { // 基本路径 baseURL已经过时 publicPath: './', // 输出文件目录 outputDir: 'dist', // eslint-loader...
vue.config.js中配置Vue的路径别名的方法
10-15
主要介绍了vue.config.js中配置Vue的路径别名的方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
Vue-cli3项目配置Vue.config.js实战记录
10-18
主要给大家介绍了关于Vue-cli3项目配置Vue.config.js的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
vue-cli3中vue.config.js配置教程详解
10-16
主要介绍了vue-cli3中vue.config.js配置教程，本文给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下
简单配置下Vite
qq_2511276124的博客
12-02 5743
Vite 是一种新型前端构建工具，能够显著提升前端开发体验。一个开发服务器，它基于 原生 ES 模块 提供了 丰富的内建功能，如速度快到惊人的 模块热更新（HMR）。一套构建指令，它使用 Rollup 打包你的代码，并且它是预配置的，可输出用于生产环境的高度优化过的静态资源。Vite 意在提供开箱即用的配置，同时它的 插件 API 和 JavaScript API 带来了高度的可扩展性，并有完整的类型支持。vite在打包时已经做了优化（代码分割、异步加载优化等），因此，无需我们过多配置即可使用。
vite(vue3+ts)项目初始化配置vite.config.ts文件
m0_61470934的博客
04-19 2085
如有问题在下方评论区询问，不定期回答。废话不多说直接上代码！
vue3导入模块@路径
你离优秀差多少
01-28 1946
【代码】vue3导入模块@路径。
Vue3开发 Vue cli3的使用
m0_51179717的博客
12-22 867
Vue项目开发脚手架 Vue Cli3的应用
vue3中提示 找不到模块 “path“ 或其相对应的类型声明
xiaodouxuan11的博客
09-30 4507
错误提示：找不到模块“path”或其相应的类型声明 或者 找不到名称“__dirname 对node进行类型声明 yarn add @types/node -D npm i @types/node --D
vue3+Ts 找不到模块“path”或其相应的类型声明 @fs/src/style.css net::ERR_ABORTED 404 (Not Found)
lqins的博客
08-23 4197
vue3+Ts 找不到模块“path”或其相应的类型声明 @fs/src/style.css net::ERR_ABORTED 404 (Not Found)
vite vue3 ts配置
lichaoqun678的博客
02-21 578
ps:如果在ts文件中导入js报错需配置tsconfig.json。在src目录下新建router目录,并新建index.js文件。在main.ts文件中把router挂载上去。2、在vite.config.ts中导入。3、在tsconfig.json中添加。最后在app.vue中使用。1、安装path插件。
vue3中vite的@路径别名与path中的resolve
Sakura1998gis的博客
10-12 8196
vite配置@路径别名 node.js中path的resolve方法解析
vue3 vite 在vite.config.ts设置index.html title name
08-30
在vue3的vite项目中，你可以通过在vite.config.ts文件中设置index.html的title和name属性来配置。首先，你需要安装vite-plugin-html插件，你可以使用以下命令进行安装：npm add vite-plugin-html -D 。 接下来，在vite.config.ts文件中，你需要引入vite-plugin-html插件和path模块，并在plugins选项中将vite插件和vite-plugin-html插件添加进去。然后，在resolve选项中，使用alias配置项为相对路径别名设置别名路径。具体的配置如下： ```typescript import { defineConfig } from 'vite'; import vue from '@vitejs/plugin-vue'; import path from 'path'; import { htmlPlugin } from 'vite-plugin-html'; //引入vite-plugin-html插件 export default defineConfig({ plugins: [ vue(), htmlPlugin() //添加vite-plugin-html插件 ], resolve: { alias: { "@": path.resolve("./src") //设置相对路径别名，使用 @ 代替 src } }, build: { rollupOptions: { input: { main: path.resolve(__dirname, 'index.html') //设置入口文件路径 } } }, base: './', //配置基础路径 server: { port: 3000, //配置开发服务器端口号 }, html: { title: 'Your Title', //设置index.html的title name: 'Your Name' //设置index.html的name } }); ``` 通过以上配置，你可以在vite.config.ts文件中设置index.html的title和name属性。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [Vue.js 3 + Vite + TypeScript 实战项目开发](https://blog.csdn.net/woyebuzhidao321/article/details/120732028)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* *3* [vue3+vite+ts配置](https://blog.csdn.net/weixin_46104934/article/details/131360786)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值