import {fileURLToPath, URL} from 'node:url'
import {defineConfig, loadEnv} from 'vite'
import vue from '@vitejs/plugin-vue' import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import {ElementPlusResolver} from 'unplugin-vue-components/resolvers' export default defineConfig(({mode}) => {
const env = loadEnv(mode, process.cwd(), '')
return {
base: './',
server: {
host: '0.0.0.0',
},
plugins: [
vue(),
AutoImport({
resolvers: [ElementPlusResolver()],
}),
Components({
resolvers: [ElementPlusResolver()],
}),
],
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
}
},
build: {
output:{
// 最小化拆分包
manualChunks: (id) => {
if (id.includes('node_modules')) {
return id.toString().split('node_modules/')[1].split('/')[0].toString();
}
},
// 用于从入口点创建的块的打包输出格式[name]表示文件名,[hash]表示该文件内容hash值
entryFileNames: 'js/[name].[hash].js',
// 用于命名代码拆分时创建的共享块的输出命名
chunkFileNames: 'js/[name].[hash].js',
// 用于输出静态资源的命名,[ext]表示文件扩展名
assetFileNames: '[ext]/[name].[hash].[ext]',
},
outDir: '../run',
rollupOptions: { }
},
} })

vite 引入element的更多相关文章

  1. vue按需引入element或mint

    vue按需引入element或mint需要添加 babel-preset-es2015 和babel-plugin-component

  2. vue项目引入element

    前提工作-安装并配置好以下环境: 1.安装node  2.安装git 1.初始化项目 vue init webpack vue-elementui npm run dev 2.安装element np ...

  3. vue-cli脚手架引入element UI的正确打开方式

    element UI官网教程:http://element-cn.eleme.io/#/zh-CN/component/quickstart 1.完整引入,直接了当,但是组件文件不是按需加载,造成多余 ...

  4. vue Cli 按需引入Element UI 和全局引用Element UI

    全局引用: 一.安装 Element UI npm i element-ui -S 二.在main.js 中引入 element UI import ElementUI from 'element-u ...

  5. vue3.0+vite按需引入element plus

    1.安装vite-plugin-style-import yarn add vite-plugin-style-import -D 2.在项目根目录下的vite.config.js中配置 import ...

  6. 在vue2.x项目中怎么引入Element UI

    参考:https://blog.csdn.net/u014054437/article/details/79862793 Element使用方法:https://element.eleme.cn/#/ ...

  7. vue按需引入Element UI的方法

    在我们的实际项目开发中,多数是采用按需引入的模式来进行开发的,那么具体应该如何操作呢,可能会有许多新人傻傻分不清楚,具体将在下文讲到. 首先我们先vue create demo创建一个项目出来此时我们 ...

  8. Vue3+Vite引入Echarts5.0图表库

    1 概述 环境Vue3+Vite,需要引入ECharts库. 2 尝试 目前ECharts已更新到5.0版本,在Vue中引入并不难,npm/cnpm安装后在需要的组件中引入: import echar ...

  9. vue-cli按需引入Element UI组件

    一.环境 使用vue-cli搭建的环境 二.安装 babel-plugin-component npm install babel-plugin-component -D 三.修改.babelrc文件 ...

  10. 新启vue_cli项目+引入Element

    [1]安装vue_cli vue init webpack 项目名字 [2]安装Element-UI cnpm install element-ui -S //写入dependencies cnpm ...

随机推荐

  1. vue+element项目部署到线上,所有icon图标不显示,解决方案

    build里边utils.js加publicPath if (options.extract) { return ExtractTextPlugin.extract({ use: loaders, f ...

  2. Win2D 投影效果 ShadowEffect

    <Page x:Class="Win2DDemo.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/ ...

  3. SpringCloud(四) - 微信获取用户信息

    1.项目介绍 2.微信公众平台 和 微信开放文档 2.1 微信公众平台 2.1.1 网址链接 https://mp.weixin.qq.com/debug/cgi-bin/sandboxinfo?ac ...

  4. 微服务实战系列(四)-注册中心springcloud alibaba nacos-copy

    1.场景描述 因要用到微服务,关于注册中心这块,与同事在技术原型上做了讨论,初步定的方案是使用:阿里巴巴的nacos+springcloud gateway,下面表格是同事整理的注册中心对比,以前用的 ...

  5. Golang-基本语法2

    http://c.biancheng.net/golang/syntax/ Go语言变量的声明(使用var关键字) Go语言是静态类型语言,因此变量(variable)是有明确类型的,编译器也会检查变 ...

  6. biancheng-Spring MVC-HandlerAdapter

    二.HandlerAdapter 根据 Handler 来找到支持它的 HandlerAdapter,通过 HandlerAdapter 执行这个 Handler 得到 ModelAndView 对象 ...

  7. Java一个入门级MVC基于Spring Boot项目

    首先根据上一篇文章内容创建一个Spring Boot项目,如图所示: 一,创建Controller并返回数据 在src/main/java/项目文件夹下面创建package,继续里面可以创建模块的pa ...

  8. ZUC-S盒输入输出测试

    问题 实现以二进制.十进制.十六进制的形式输入,经过S盒,输出十六进制 输入: 1.二进制:10001010010011110000011110111101 2.十进制:2320435133 3.十六 ...

  9. 推荐一款非常好用的在线 SSH 管理工具

    前言 SSH工具在远程连接.文件传输.远程管理和增强安全性等方面发挥着重要作用,是我们开发人员和系统管理员不可或缺的工具.今天大姚给大家推荐一款非常好用的在线 SSH 管理工具:Xterminal. ...

  10. Fractal pg walkthrough Easy

    nmap ┌──(root㉿kali)-[~] └─# nmap -p- -A 192.168.157.233 Starting Nmap 7.94SVN ( https://nmap.org ) a ...