component: () => import('@/components/HelloWorld2.vue'),改为 component: () => import('/@/components/HelloWorld2.vue'),如果没有这个/@则调用的位置会自动从@node_module里去查找目录,导致路径始终获取失败。 创建路由 文件目录配置好之后我们就可以创建路由 安装路由: yarn add vue-router@next // ...
重点是路径被拦截重写了,特别是'vue'加了一个/@modules/的前缀。对于引用 node_modules 模块的路径,vite 都进行替换,增加了/@modules/这个前缀,之后浏览器再重新发起/@modules/xxx的请求,然后 vite 再拦截,再去访问真正的模块路径,听着似乎有点绕。 上图是在vite/dist/node/server/serverPluginModuleRewrite.js...
1、node_modules文件夹的问题 文件夹以及文件过多过碎,当我们将项目整体拷贝给别人的时候,,传输速度会很慢很慢. 复杂的模块依赖关系需要被记录,确保模块的版本和当前保持一致,否则会导致当前项目运行报错 在传给别人的时候,不需要传node_modules里面的东西 package.json文件的作用 项目描述文件,记录了当前项目信息,例...
实际上,Vite 会判断模块的实际路径,是否在 node_modules 中: • 实际路径在 node_modules 的模块会被预构建,这是第三方模块 • 实际路径不在 node_modules 的模块,证明该模块是通过文件链接,链接到 node_modules 内的(monorepo 的实现方式),是开发者自己写的代码,不执行预构建 依赖扫描 实现思路 我们再来看...
// 转换前的源代码import{createApp}from'vue'import'./style.css'importAppfrom'./App.vue'createApp(App).mount('#app')// 转换后的代码import{createApp}from"/node_modules/.vite/deps/vue.js?v=3386baa1";import"/src/style.css";importAppfrom"/src/App.vue";createApp(App).mount("#app");...
fs.strict) return true // 标准化为绝对路径 const file = fsPathFromUrl(url) if (server._fsDenyGlob(file)) return false if (server.moduleGraph.safeModulesPath.has(file)) return true if (server.config.server.fs.allow.some((dir) => isParentDirectory(dir, file))) return true return false...
//vite.config.jsimport{defineConfig}from'vite'import{ViteAliases}from'./node_modules/vite-aliases'// 通过名称引入会报错,可能是插件问题exportdefaultdefineConfig({plugins: [ViteAliases() ] }) 1. 2. 3. 4. 5. 6. 7. 8. 9. 相应的路径别名如下: ...
root: process.cwd(),//项目根目录(index.html 文件所在的位置),base: '/',//开发或生产环境服务的公共基础路径 配置引入相对路径mode: 'development',//模式plugins: [vue()],//需要用到的插件数组publicDir: 'public',//静态资源服务的文件夹cacheDir: 'node_modules/.vite',//存储缓存文件的目录resolve...
// 转换前的源代码import { createApp } from 'vue'import './style.css'import App from './App.vue'createApp(App).mount('#app')// 转换后的代码import { createApp } from "/node_modules/.vite/deps/vue.js?v=3386baa1";import "/src/style.css";import App from "/src/App.vue";create...
3.默认状况下,咱们在执行npm install -g XXXX时,下载了一个全局包,这个包的默认存放路径位置C:\Users\Administrator\AppData\Roaming\npm\node_modules,可输入npm root -g查看,可以通过一些配置修改这个目录,我这里省略 3.常用npm命令 1.npm config list 可以查看一些配置 ...