To build assets locally and push them to production without the node_modules directory on the server, you can use a build tool like Webpack or Vite to bundle your assets and dependencies into a single file. This way, you can upload the bundled file to your server without needing to install any dependencies.
Here's an example of how you can use Vite to build your assets locally:
- Install Vite as a development dependency:
npm install vite --save-dev
- Create a Vite configuration file (
vite.config.js) in the root of your project:
// vite.config.js
import { defineConfig } from 'vite'
import { createVuePlugin } from 'vite-plugin-vue2'
export default defineConfig({
plugins: [createVuePlugin()],
build: {
outDir: 'dist',
assetsDir: 'assets',
rollupOptions: {
input: 'resources/js/app.js',
},
},
})
This configuration file tells Vite to use the Vue plugin, output the built files to the dist directory, and use resources/js/app.js as the entry point for the build.
- Add a build script to your
package.jsonfile:
{
"scripts": {
"build": "vite build"
}
}
- Run the build script to build your assets:
npm run build
This will create a dist directory containing your built assets and dependencies.
- Upload the
distdirectory to your server and serve the built files from there.
Note: You may need to adjust the paths in your application to point to the correct location of the built assets on the server.
Also, make sure to exclude the node_modules directory from your version control system (e.g. Git) so that it's not uploaded to your server.