时间戳

首页 > 解决方案 > 将元素ui导入nuxt时出现样式错误

vuejs2 - 将元素ui导入nuxt时出现样式错误

问题描述

我正在尝试将元素 UI 导入 Nuxt.js 并在他们的 Twitter 帐户上链接到故障（https://glitch.com/edit/#!/nuxt-element-ui?path=layouts/default.vue:1 :0 ) 列出了重要文件。在你的 default.vue 中列出了这个

<template>
  <div>
    <nuxt/>
  </div>
</template>

<style src="element-ui/lib/theme-default/index.css"></style>

我通过运行将元素 ui 导入到我的 nuxt 项目中：

 npm i element-ui --save nuxt

在文件夹中搜索 index.css 并将该链接作为源复制粘贴到 default.vue 文件的样式 src (node_modules\element-ui\lib\theme-chalk\index.css)，但出现错误它无法找到它。

我还尝试使用 element ui 网站上的 cdn 样式文件：

https://unpkg.com/element-ui/lib/theme-chalk/index.css

它们都导致“找不到模块”

我究竟做错了什么？任何其他地方都列出了如何将元素 ui 导入 nuxt？

标签： vuejs2nuxt.jselement-ui

解决方案

在您的样式中，您可以像这样导入它：

<style>
  @import '~element-ui/lib/theme-default/index.css'
</style>

但您也可以直接从您的 javascript 导入它：

import 'element-ui/lib/theme-default/index.css';

推荐阅读