2

我正在尝试使用 vue.js 应用程序将 primevue 添加到我的 jhister 中。我正在遵循这些步骤。

1-运行这些评论

npm install primevue --save
npm install primeicons --save

2-将它们添加到我的 vendor.scss

@import '~primevue/resources/primevue.min.css';
@import '~primevue/resources/themes/nova-light/theme.css';
@import '~primeicons/primeicons.css';

3-当我运行 npm start 命令时。我收到这些错误。

ERROR in ./src/main/webapp/content/scss/vendor.scss (./node_modules/css-loader/dist/cjs.js??ref--9-1!./node_modules/postcss-loader/src??ref--9-2!./
node_modules/sass-loader/lib/loader.js??ref--9-3!./src/main/webapp/content/scss/vendor.scss)
Module build failed (from ./node_modules/postcss-loader/src/index.js):
Error: Failed to find 'node_modules/primevue/resources/primevue.min.css'
  in [
    C:\work\workspace\aymer workspace\fiyatkolay\fiyatkolayweb\src\main\webapp\content\scss
  ]
    at resolveModule.catch.catch (C:\work\workspace\aymer workspace\fiyatkolay\fiyatkolayweb\node_modules\postcss-import\lib\resolve-id.js:35:13)
 @ ./src/main/webapp/content/scss/vendor.scss 4:14-231 14:3-18:5 15:22-239
 @ ./src/main/webapp/app/main.ts
 @ multi (webpack)-dev-server/client?http://localhost:9060 ./src/main/webapp/app/main.ts

如何将 Primevue 与我的 jhipster 应用程序集成。谢谢您的帮助！！！

4

1 回答 1

1

我对 Vue 不是很熟悉，但官方文档示例直接导入 CSS 文件。我检查了primevue-quickstart并以这种方式成功集成了这两个库。

1.安装primevue和 primeicons

如果您使用的是 npm，请打开终端并执行以下命令：

npm i primevue primeicons

或者如果您使用的是纱线，请执行以下操作：

yarn add primevue primeicons

2.添加需要的CSS文件

打开您的main.ts文件并在顶部附近添加以下行：

import 'primevue/resources/themes/nova-light/theme.css';
import 'primevue/resources/primevue.min.css';
import 'primeicons/primeicons.css';

3.导入你要使用的组件

main.ts如果您希望所有PrimeVue组件在全球范围内可用，您可以将以下代码行添加到您的文件中。如果您只想让它们在特定视图中可用，则将它们添加到[component-name].component.ts（例如）中。home.component.ts

import Button from 'primevue/button';
Vue.component('Button', Button);

4. 在你的视图中使用 PrimeVue 组件

打开您的[component-name].vue（例如home.vue）文件并通过添加 HTML 标记开始使用 UI 组件。我导入了Button组件，所以在我的情况下，它是这样的：

<Button label="Click" icon="pi pi-check" />

我很确定我们应该能够按照您首先尝试的方式使用这两个库，但我无法让它以任何其他方式工作。

于 2020-02-23T16:00:18.963 回答