使用vue3+vite官网方法创建的项目，现在安装element-plus
1.安装element-plus
# 选择一个你喜欢的包管理器
# NPM
$ npm install element-plus --save
# Yarn
$ yarn add element-plus
# pnpm
$ pnpm install element-plus
package.json文件如下，element-plus^2.4.3版本
{
"name": "vue-project",
"version": "0.0.0",
"private": true,
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
},
"dependencies": {
"element-plus": "^2.4.3",
"vue": "^3.3.4",
"vue-router": "^4.2.5"
},
"devDependencies": {
"@vitejs/plugin-vue": "^4.4.0",服务器托管网
"vite": "^4.4.11"
}
}2.引入——完整引入
如果你对打包后的文件大小不是很在乎，那么使用完整导入会更方便。
// main.js
import './assets/main.css'
import { createApp } from 'vue'
import App from './App.vue'
import router from './router/routes.js'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
createApp(App).use(router).use(ElementPlus).mount('#app')在页面中写一个按钮
You’ve successfully created a project with
Vite +
Vue 3.
按钮
如图，安装成功
3.引入——自动导入（推荐）
也是自动的按需导入，需要借助两个插件来导入要使用的组件，安装unplugin-vue-components和unplugin-auto-import这两款插件。
npm install -D unplugin-vue-components unplugin-auto-import
在vite.config.js中进行配置
代码如下：
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } 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'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [
vue(),
// ...自动导入
AutoImport({
resolvers: [ElementPlusResolver()],
}),
Components({
resolvers: [ElementPlusResolver(服务器托管网)],
}),
],
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
}
}
})
这样配置之后，就可以直接用了，非常好
服务器托管，北京服务器托管，服务器租用 http://www.fwqtg.net
机房租用，北京机房租用，IDC机房托管， http://www.fwqtg.net
今天依旧通过PowerShellPlus的示例脚本来学习PowerShell。 ## ===================================================================== ## Title : Add-AD…
