一个新创建的项目如何使用element-plus中的组件

首先说一下今天算法情况:今天开始贪心算法,看完介绍之后才了解这个名字得来历——在每一阶段都挑选最合适的(注意是最合适的,不是最大的,因为有些情况下也可能需要找最小的),从而组成整个算法的最优解。其实在很多时候大家在不知不觉中就会使用到贪心算法,在写这类算法时只需要保持平常心,稍微注意一点点就可以了,不用特别注意。

然后就是今天的主题:在一个新创建的项目中使用element-plus的准备条件

首先要保证安装了相应的插件:在vscode或者黑窗口中执行以下两行代码,在相应文件中或者全局安装element-plus环境。

npm install element-plus --save

npm install @element-plus/icons-vue --save

然后找到项目中的main.ts文件,引入elementplus并且配置element-plus国际化。

import ElementPlus from 'element-plus'

import 'element-plus/theme-chalk/index.css'

import zhCn from 'element-plus/dist/locale/zh-cn.mjs'

最后在获取应用的实例对象之后安装element-plus插件:

app.use(ElementPlus, {

  locale: zhCn, // element-plus国际化的配置

})

再补充一点,如果想要使用icon图标的话还需要进行以下操作:

引入:import * as ElementPlusIconsVue from '@element-plus/icons-vue'

创建(在App创建之后):for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}

附图:一个新创建的项目如何使用element-plus中的组件_第1张图片

你可能感兴趣的:(vue,前端框架,elementui)