You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: UPGRADE.md
+9-13Lines changed: 9 additions & 13 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -2,11 +2,11 @@
2
2
3
3
## Migrating from Laravel Mix to Vite
4
4
5
-
> **Note:** This upgrade guide does not cover all possible Mix usages, such as Sass compilation. Please consult the [Vite documentation](https://vitejs.dev/guide/) for information on configuring Vite for these scenarios.
5
+
> **Note:** This upgrade guide does not cover all possible Mix use cases, such as Sass compilation. Please consult the [Vite documentation](https://vitejs.dev/guide/) for information on configuring Vite for these scenarios.
6
6
7
7
### Install Vite and the Laravel Plugin
8
8
9
-
First you will need to install [Vite](https://vitejs.dev/) and the [Laravel Vite Plugin](https://www.npmjs.com/package/laravel-vite-plugin) using your npm package manager of choice:
9
+
First, you will need to install [Vite](https://vitejs.dev/) and the [Laravel Vite Plugin](https://www.npmjs.com/package/laravel-vite-plugin) using your npm package manager of choice:
10
10
11
11
```shell
12
12
npm install --save-dev vite laravel-vite-plugin
@@ -53,7 +53,7 @@ export default defineConfig({
53
53
54
54
If you are building an SPA, you will get a better developer experience by removing the CSS entry point above and [importing your CSS from Javascript](#importing-your-css-from-your-javascript-entry-points).
55
55
56
-
### Update NPM Scripts
56
+
### Update NPM scripts
57
57
58
58
Update your NPM scripts in `package.json`:
59
59
@@ -71,9 +71,9 @@ Update your NPM scripts in `package.json`:
71
71
}
72
72
```
73
73
74
-
### Make your imports compatible with Vite
74
+
### Vite compatible imports
75
75
76
-
Vite only supports ES modules, so if you are upgrading an existing application you will need to replace any `require()` statements with `import`. You may refer to [this PR](https://github.com/laravel/laravel/pull/5895/files) for an example.
76
+
Vite only supports ES modules, so if you are upgrading an existing application you will need to replace any `require()` statements with `import`. You may refer to [this pull request](https://github.com/laravel/laravel/pull/5895/files) for an example.
77
77
78
78
#### Inertia
79
79
@@ -188,9 +188,7 @@ If you are using StyleCI and have ignored the `webpack.mix.js` file in your conf
188
188
189
189
### Optional: Configure Tailwind
190
190
191
-
If you are using Tailwind, perhaps with one of Laravel's starter kits, you will need a `postcss.config.js` file.
192
-
193
-
Tailwind can generate this for you automatically:
191
+
If you are using Tailwind, perhaps with one of Laravel's starter kits, you will need a `postcss.config.js` file. Tailwind can generate this for you automatically:
194
192
195
193
```shell
196
194
npx tailwindcss init -p
@@ -225,7 +223,7 @@ You may remove your dedicated Laravel Mix SSR configuration:
225
223
rm webpack.ssr.mix.js
226
224
```
227
225
228
-
In most cases you won't need a dedicated SSR configuration file with Vite. You can specify your SSR entry point by passing a configuration option to the Laravel plugin.
226
+
In most cases you won't need a dedicated SSR configuration file when using Vite. You can specify your SSR entry point by passing a configuration option to the Laravel plugin:
0 commit comments