在Vue 3项目中,使用Vite进行打包时,可以通过修改vite.config.js(或vite.config.ts,如果你使用TypeScript)文件来配置部分打包选项。以下是一些常见的配置步骤,帮助你打包Vue 3项目: 安装依赖: 确保你的项目中已经安装了Vue 3和Vite。你可以通过npm或yarn来安装这些依赖: bash npm install vue@next vite 或者 bash...
项目里面,引入文件:"../assets/vue.svg"、"../components/HelloWorld.vue"改为"@/assets/vue.svg"、"@/components/HelloWorld.vue"
VUE3+VITE项目开发环境连接后端和打包部署连接后端设置是不一样的:一个是直接在vite.config.ts中配置,一是要用nginx来做代理;二是注意nginx的配置的地址后面的"/"。
pnpmaddvite@vitejs/plugin-vue-D-w 在components 文件下新建vite.config.ts配置文件 import{ defineConfig }from"vite";importvuefrom"@vitejs/plugin-vue";exportdefaultdefineConfig({build: {//打包后文件目录outDir:"es",//压缩minify:false,rollupOptions: {//忽略打包vue文件external: ["vue"],//input:...
vite.config.js 是一个配置文件，用于定制和优化 Vite 项目的开发和打包过程。通过该配置文件，可以调整项目的开发服务器设置、构建选项、使用插件以及其他高级功能，以满足项目的具体需求。视频 基础配置项 server 选项 本地运行时，开发环境服务器的配置。host 默认 localhost，设置为 true 或 0.0.0.0 时会监听...
// https://vitejs.dev/config/ export default defineConfig({ base: './', // 生产环境下的公共路径 server: { // 是否开启 HTTPS // https: false, // 默认是 localhost。设置 host: true 或 host: "0.0.0.0",处于同一网络环境下的其他设备,可通过 Network 的地址形式,以 IP 访问项目 ...
一、 使用Vite创建Vue3项目 1.全局安装vite，使用命令npm install vite -g 2.创建vue3项目，使用命令 npm create vite@latest ,确认项目名 称，选择Vue及TypeScript 3. 使用用vscode打开项目，运行命令 npm install npm run dev 4.整个项目目录结构如下：5.访问页面 二、将打包项目发布到Nginx 1.将打包后...
一、Svg配置 每次引入一张SVG图片都需要写一次相对路径,并且对SVG图片进行压缩优化也不够方便。 vite-svg-loader插件加载SVG文件作为Vue组件,使用SVGO进行优化。 插件网站https://www.npmjs.com/package/vite-svg-loader 1. 安装 pnpm i vite-svg-loader-D ...
3. vite打包配置 因为是需要单独的当作sdk库使用, 所以需要把组件的css打包到js中 所以需要安装vite插件vite-plugin-css-injected-by-js pnpm add vite-plugin-css-injected-by-js -D 配置vite.config.js import{defineConfig}from'vite'importvuefrom'@vitejs/plugin-vue'importcssInjectedByJsPluginfrom'vite-pl...