I want to use the package in Vue JS – DatePicker from Primevue
The documentation says that you need to install the package using the command – npm install [email protected]. And half on it is work. But I have problem with DatePicker and ToastService on it. I don’t see these packages in the folder -> Primevue. And I can’t find instructions to force install these packages in node_modules.
Attached a screenshot of the error.
Please, help
//app.js code
import './bootstrap';
import {createApp} from 'vue';
import PrimeVue from 'primevue/config';
import InputText from 'primevue/inputtext';
import DatePicker from 'primevue/datepicker';//PHPStorm show message -> Module is not installed
import ToastService from "primevue/toastservice";
import 'primevue/resources/themes/aura-light-green/theme.css'
const app = createApp({});
import router from "./router.js";
app.component('index', Index);
app.component('DatePicker', DatePicker);
app.component('InputText', InputText);
app.component('ToastService', ToastService);
app.directive('styleclass', StyleClass);
app.use(PrimeVue);
app.use(router);
app.mount('#app');
[plugin:vite:import-analysis] Failed to resolve import "primevue/datepicker" from "resources/js/app.js". Does the file exist?
/var/www/crm/resources/js/app.js:7:25
5 | import Multiselect from 'vue-multiselect'
6 | import InputText from 'primevue/inputtext';
7 | import DatePicker from 'primevue/datepicker';
| ^
8 | import Button from 'primevue/button';
9 | import Toast from 'primevue/toast';
at TransformPluginContext._formatError (file:///var/www/crm/node_modules/vite/dist/node/chunks/dep-BcXSligG.js:49703:41)
at TransformPluginContext.error (file:///var/www/crm/node_modules/vite/dist/node/chunks/dep-BcXSligG.js:49698:16)
at normalizeUrl (file:///var/www/crm/node_modules/vite/dist/node/chunks/dep-BcXSligG.js:64260:23)
at async file:///var/www/crm/node_modules/vite/dist/node/chunks/dep-BcXSligG.js:64392:39
at async Promise.all (index 6)
at async TransformPluginContext.transform (file:///var/www/crm/node_modules/vite/dist/node/chunks/dep-BcXSligG.js:64319:7)
at async PluginContainer.transform (file:///var/www/crm/node_modules/vite/dist/node/chunks/dep-BcXSligG.js:49544:18)
at async loadAndTransform (file:///var/www/crm/node_modules/vite/dist/node/chunks/dep-BcXSligG.js:52366:27)
at async viteTransformMiddleware (file:///var/www/crm/node_modules/vite/dist/node/chunks/dep-BcXSligG.js:62102:24
Use PHP 8.1 & Laravel 10.
I re-read all the documentation, but unfortunately there is no information there that is suitable for me on this problem.
I tried to find similar problems on the Internet, but did not find anything similar.
2
Answers
ok do you have folder
node_modulesprimevuedatepicker
in your project?They should be there after primevue installation RC1 or RC2 if not – please run again
npm install
for primevue and look for any errors in output.If you have folder for datepicker did you run bundle assets step –
npm run dev
?I just installed [email protected] in a fresh project, and after running
npm install
I verified that I can see the folderdatepicker
within node_modules/primevue/datepicker. I’d recommend verifying that yourpackage.json
includes the dependency"primevue": "^4.0.0-rc.2"
, then deleting yournode_modules
folder and running a freshnpm install
.As a side note, I would also recommend upgrading to [email protected] as they patched a few bugs in the DatePicker, as indicated in the release notes.