LogoLogo
v1.6.1
v1.6.1
  • 🌸What is Petal Pro?
  • πŸ’‘Changelog
  • ⏫Upgrade guide
  • Guides
    • πŸš€Creating a web app from start to finish
  • πŸ‘©β€πŸ³Recipes
    • πŸ’How to apply a recipe with git cherry pick
    • #️⃣UUIDs
    • ✍️First/Last name
    • πŸ“¦NPM packages
    • πŸ—ΊοΈGoogle Maps
  • Fundamentals
    • πŸ’ΏInstallation
    • πŸ“‚Folder structure
    • πŸ—ƒοΈIncluded Pages
    • πŸ˜€Users & Authentication
    • 🏒Organizations & Multitenancy
    • 🧊Components
    • ⬛Dark mode
    • 🎨Branding
    • 🌱Seeding
    • πŸ“„Layouts & Menus
    • πŸ–ΌοΈImage uploads
    • πŸ‘₯Impersonation
    • πŸ› οΈBackground Tasks and Jobs
    • πŸ”§Util & Helpers
    • πŸ“§Emails
    • πŸͺJavascript Hooks
    • πŸ“šExtra Hex Libraries
    • πŸ—οΈGenerators
    • πŸ—£οΈTranslations
    • πŸ–οΈContributing
    • πŸ›«Deployment
    • πŸ›‘οΈTesting
Powered by GitBook
On this page

Was this helpful?

  1. Recipes

NPM packages

PreviousFirst/Last nameNextGoogle Maps

Last updated 1 year ago

Was this helpful?

This recipe creates a package.json file and allows you to import NPM packages into your app.js file.

How to use

Note: this has been rebased on the latest main branch and might not work properly on v1.3.0 and below. However, you should be able to work out how to apply it based on the diffs.

Run asdf install to install the Node version mentioned in .tool-versions.

Run npm install -g npm to install NPM.

Run mix setup or cd assets && npm install.

Now when you run the server, it should all be working.

Add a new package

cd assets && npm i tippy.js

Then, in your app.js:

import tippy from 'tippy.js';

Follow the with the branch recipes/npm.

Here's how to install :

πŸ‘©β€πŸ³
πŸ“¦
cherry-pick instructions
tippy.js
https://github.com/petalframework/petal_pro/commits/recipes/npm