web-dev-qa-db-fra.com

Comment inclure correctement une bibliothèque de node_modules dans votre projet?

la question peut être stupide mais n'a pas trouvé de réponse jusqu'à présent.
J'essaie d'inclure une bibliothèque de node_modules, d'après ce que j'ai appris depuis hier, nous devrions inclure comme ça avec atout:

{{-- bootstrap 4.1.3 --}} 
<link href="{{asset('css/app.css')}}" rel="stylesheet" type="text/css">

Je veux ajouter selectize.js dans mon projet, j'ai donc utilisé npm install selectize --save pour être directement installé et enregistré dans package.json (dépendances).

Ma question est, comment puis-je inclure cela maintenant? Tout comme par défaut bootstrap is. ​​Comment puis-je passer de node_modules / à public /?
Dois-je le faire manuellement ou existe-t-il une façon plus professionnelle/plus propre de le faire?
Merci pour l'aide.

laravelnpmassetsnode-modulesselectize.js
10
William

Donc, après beaucoup de vidéos YouTube et Google, j'ai trouvé la réponse que je cherchais.
Voici les étapes:

1- Dans le webpack.mix.js:

mix.scripts([
        'node_modules/bootstrap/dist/js/bootstrap.js',
        'node_modules/selectize/dist/js/selectize.js'
    ],  'public/js/app.js')

    .styles([
        'node_modules/bootstrap/dist/css/bootstrap.css',
        'node_modules/selectize/dist/css/selectize.css',
        'resources/assets/css/app.css'
    ],  'public/css/app.css');

2- npm run dev
3- importation dans la vue

<link rel="stylesheet" href="{{asset('css/app.css')}}">  
<script src="{{asset('js/app.js')}}"></script>
18
William

Cela devrait fonctionner, ajoutez cette ligne à la ligne bootstrap.js ou app.js des dossiers.

window.selectize = require('selectize');

Ou si vous voulez juste charger le js, quelque chose comme

require('selectize/dist/selectize.js');

Devrait marcher

N'oubliez pas de faire ensuite: npm run dev ou npm run production

Remarque: je n'ai jamais utilisé selectize donc je ne peux pas vous aider dans les appels à la bibliothèque ... mais quelque chose comme ça devrait le charger.

La dernière étape (npm run dev) ajoute selectize au fichier app.js compilé dans votre dossier public

La partie CSS sur laquelle vous l'ajoutez app.scss il suffit de suivre l'exemple donné.

De plus, avant tout cela ... vous devriez avoir exécuté php artisan preset none/bootstrap/vue et npm install reportez-vous aux documents pour plus d'informations à ce sujet: https://laravel.com/docs/5.6/frontend

4
Erubiel