启动配置文件和webpack方式一样 package.json里 “dev”: “vite --config ./vite.config.js” const {resolve} = require('path') export default { alias: { '/@/': resolve(__dirname, './src') } } 1. 2. 3. 4. 5. 6. 注意:这里定义@目录时,前面必须要添加斜杠/表示从根目录进来获取组件。
path: path.resolve(__dirname, 'dist'), filename: 'bundle.js' } } 1. 2. 3. 4. 5. 6. 7. 8. entry 是入口文件,output是导出文件,但是我们不能简单地设置为 './dist/bundle.js',这里我们要使用绝对路径,所以需要引入path,path是存在于node包里,这里涉及到node的知识,就不详细讲述,所以你还需要...
对于项目中的业务模块,Vite 利用现代浏览器内置的 ES Module 支持,由浏览器直接向 dev server 逐个请求加载这些模块——因此你往往可以看到本地环境下大量的 HTTP 请求刷屏,这也是 Vite 最鲜明的特征。 对于项目中的 node_modules 依赖,Vite 借助esbuild这类由原生语言开发的高性能 bundler,将这些库中非 ESM 标准(...
例如vue,会解析到实际 node_modules 中的 vue 的入口 js 文件 加载:根据解析的路径,读取文件的内容 插件可以定制化解析和加载的过程,下面是一些插件示例代码: 代码语言:typescript 复制 constplugin={name:'xxx',setup(build){// 定制解析过程,所有的 http/https 的模块,都会被 externalbuild.onResolve({filter:...
require.resolve('vue-tsc/out/proxy').split('node_modules')[0], 'node_modules/.bin/vue-tsc', ); spawn.sync( vueTscPath, ['--rootDir', rootDir, '--declaration', '--emitDeclarationOnly', '--declarationDir', outputDir], { stdio: 'ignore', ...
通过该方式可以调试cli.js部分代码,如果想启动一个服务,然后调试vite源码,建议自己本地搭建一个vite项目(或者也可以用我的项目我的vite项目),然后用vscode的调试模块,这样就可以启动一个服务,在node_modules\vite\dist\node\chunks\dep-3007b26d.js中打断点,调试相关代码,因为这边相当于是起了一个node服务,因此我...
vite项目在创建时,会同时生成tsconfig.json和tsconfig.node.json文件,tsconfig.node.json文件专门用于Node.js环境的TypeScript配置文件,它定义了用于Node.js应用程序的TypeScript编译器选项。vite项目会优先使用tsconfig.json中配置,但是有时候,会出现判定问题,比如你的文件中使用了commonjs的模块语法,那么ts解析就会自动的...
vitejs/vite/issues/1930// https://vitejs.dev/guide/env-and-mode.html#env-files// 在这里自定义变量define:Object.assign(processEnvValues, {}), resolve: { alias: {'vue-i18n':'vue-i18n/dist/vue-i18n.cjs.js','node-fetch':'isomorphic-fetch',// This Rollup aliases are extracted from @...
首先会去查找缓存目录(默认是 node_modules/.vite)下的 _metadata.json 文件;然后找到当前项目依赖信息(xxx-lock 文件)拼接上部分配置后做哈希编码,最后对比缓存目录下的 hash 值是否与编码后的 hash 值一致,一致并且没有开启 force 就直接返回预构建信息,结束整个流程; ...
exclude: resolve('node_modules/**'), allowSyntheticDefaultImports:true, }), ], build: {//...}, }); 打包配置到这里就完成了,执行yarn build命令就能打包组件库 四、发布到 npm 作为一个组件库,在发布到 npm 之前需要调整一下package.json