【笔记】20240927 cesium+vue3+elementUI项目初始化

119 阅读1分钟

前言

纯个人向的记录。因为每次开新项目,初始化的时候都丢三落四的,所以写了这么一篇笔记,欢迎交流意见。

流程

pnpm create vue@3

依赖包

pnpm add @element-plus/icons-vue @turf/turf axios cesium element-plus eventemitter3 lodash vite-plugin-cesium ^
&& pnpm add -d @types/geojson @types/lodash sass swagger-typescript-api

viteConfig配置

import { fileURLToPath, URL } from 'node:url'

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import cesium from 'vite-plugin-cesium'

// https://vitejs.dev/config/
export default defineConfig({
  base: '/',
  build: {
    target: 'ES2020',
    sourcemap: true
  },
  plugins: [vue(), cesium()],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  }
})

elementUI全局TS支持

在src目录下创建env.ts,写入

/// <reference types="vite/client" />
/// <reference types="element-plus/global" />

main.ts

import './assets/main.css'
import 'element-plus/dist/index.css'
import ElementPlus from 'element-plus'

import { createApp } from 'vue'
import { createPinia } from 'pinia'

import App from './App.vue'
import router from './router'

const app = createApp(App)

app.use(createPinia())
app.use(router)

app.use(ElementPlus)
app.mount('#app')

eslintrc.cjs

/* eslint-env node */
require('@rushstack/eslint-patch/modern-module-resolution')

module.exports = {
  root: true,
  extends: [
    'plugin:vue/vue3-essential',
    'eslint:recommended',
    '@vue/eslint-config-typescript',
    '@vue/eslint-config-prettier/skip-formatting'
  ],
  parserOptions: {
    ecmaVersion: 'latest'
  },
  rules: {
    'no-console': [1, { allow: ['warn', 'error'] }]
  }
}