外部模块
除了项目默认引入的外部模块,有时我们还需要引入其他外部模块。我们以 ant-design-vue 为例:
安装依赖
安装依赖到指定包
- 由于项目采用了 pnpm 作为包管理工具,所以我们需要使用
pnpm
命令来安装依赖。 - 通过采用了 Monorepo 模块来管理项目,所以我们需要在指定包下安装依赖。安装依赖前请确保已经进入到指定包目录下。
bash
# cd /path/to/your/package
pnpm add ant-design-vue
使用
全局引入
ts
import { createApp } from 'vue';
import Antd from 'ant-design-vue';
import App from './App';
import 'ant-design-vue/dist/reset.css';
const app = createApp(App);
app.use(Antd).mount('#app');
使用
vue
<template>
<a-button>text</a-button>
</template>
局部引入
vue
<script setup lang="ts">
import { Button } from 'ant-design-vue';
</script>
<template>
<Button>text</Button>
</template>
注意
- 如果组件有依赖样式,则需要再引入样式文件