How the JavaScript ships

There is nothing to install from npm. @commentify/core, @commentify/react, and @commentify/vue travel inside usamamuneerchaudhary/commentify-pro, so one license covers PHP and JavaScript.

What the installer does

Copies the built packages from the Composer package’s resources/js/ship/ into resources/js/vendor/commentify/{core,react,vue}.
Adds local paths to package.json:

"dependencies": {
    "@commentify/core": "file:resources/js/vendor/commentify/core",
    "@commentify/react": "file:resources/js/vendor/commentify/react"
}

Your package manager links them into node_modules. Ordinary bare imports resolve in Vite, tsc, and test runners. No bundler alias.

Adds Tailwind v4 @source '../js/vendor/commentify'; so utility classes in the compiled SDK are not purged.
Scaffolds resources/js/components/CommentThread.tsx or .vue outside vendor. That file is yours; the installer will not overwrite it unless you pass --force.

Treat resources/js/vendor/commentify as vendor code. The installer overwrites it on every run.

Refresh after `composer update`

php artisan vendor:publish --tag=commentify-pro-js --force
npm install

Tailwind

Without scanning the SDK, the thread renders with no styling. If the installer could not patch CSS:

@import "tailwindcss";
@source '../js/vendor/commentify';

Vite pitfalls

Do not add @commentify/* to optimizeDeps.include. That also silences React Refresh issues, but Vite keys the pre-bundle cache on the lockfile, not on a linked package’s contents. After every vendor:publish the browser keeps running a version you no longer have on disk. If you already hit this: remove the include, delete node_modules/.vite, restart Vite.

React Refresh

The SDK is symlinked from resources/js/vendor, which is inside your project, so Vite treats pre-built library code as source and may inject React Refresh into it. Exclude it in vite.config.js:

import react from '@vitejs/plugin-react';

export default defineConfig({
    plugins: [
        laravel({ /* … */ }),
        react({ exclude: [/resources\/js\/vendor\/commentify/] }),
    ],
});

In the Blade layout that loads the React entry, @viteReactRefresh must appear before @vite(...). Without it, dev throws @vitejs/plugin-react can't detect preamble. Often pointed at a vendor file, not the missing directive. Inertia starter kits already include it in app.blade.php. Vue needs no exclusion: the SDK ships compiled, so @vitejs/plugin-vue has nothing to transform.

Peer dependencies

The SDK declares react / react-dom or vue as peers. npm installs missing peers automatically; pnpm and yarn do not. The installer prints a follow-up if they are missing from package.json.

npm install react react-dom
npm install -D @vitejs/plugin-react

npm install vue
npm install -D @vitejs/plugin-vue

One UI, three stacks

Class strings live once in @commentify/core. MarkupParityTest.php compares them to core Blade views. React and Vue render tests assert the components emit those same classes. ResourceParityTest.php does the same for avatars, relative timestamps, mention HTML, and report state. That is why you should keep using <CommentThread /> from the package rather than copying markup into the app. Blade and JS stay in step as Commentify updates.

Commentify

Commentify Pro

Frontends

API

Moderation

Features

Help

What the installer does

Refresh after `composer update`

Tailwind

Vite pitfalls

React Refresh

Peer dependencies

One UI, three stacks

​What the installer does

​Refresh after composer update

​Tailwind

​Vite pitfalls

​React Refresh

​Peer dependencies

​One UI, three stacks

What the installer does

Refresh after `composer update`

Tailwind

Vite pitfalls

React Refresh

Peer dependencies

One UI, three stacks