Skip to content

Commit 4274619

Browse files
committed
update example
1 parent 414ac66 commit 4274619

File tree

1 file changed

+6
-3
lines changed

1 file changed

+6
-3
lines changed

frontend.md

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -60,16 +60,19 @@ By default, the Laravel `webpack.mix.js` file compiles your SASS and the `resour
6060
<a name="writing-vue-components"></a>
6161
### Writing Vue Components
6262

63-
By default, fresh Laravel applications contain an `Example.vue` Vue component located in the `resources/assets/js/components` directory. The `Example.vue` file is an example of a [single file Vue component](https://vuejs.org/guide/single-file-components) which defines its JavaScript and HTML template in the same file. Single file components provide a very convenient approach to building JavaScript driven applications. The example component is registered in your `app.js` file:
63+
By default, fresh Laravel applications contain an `ExampleComponent.vue` Vue component located in the `resources/assets/js/components` directory. The `ExampleComponent.vue` file is an example of a [single file Vue component](https://vuejs.org/guide/single-file-components) which defines its JavaScript and HTML template in the same file. Single file components provide a very convenient approach to building JavaScript driven applications. The example component is registered in your `app.js` file:
6464

65-
Vue.component('example', require('./components/Example.vue'));
65+
Vue.component(
66+
'example-component',
67+
require('./components/ExampleComponent.vue')
68+
);
6669

6770
To use the component in your application, you may simply drop it into one of your HTML templates. For example, after running the `make:auth` Artisan command to scaffold your application's authentication and registration screens, you could drop the component into the `home.blade.php` Blade template:
6871

6972
@extends('layouts.app')
7073

7174
@section('content')
72-
<example></example>
75+
<example-component></example-component>
7376
@endsection
7477

7578
> {tip} Remember, you should run the `npm run dev` command each time you change a Vue component. Or, you may run the `npm run watch` command to monitor and automatically recompile your components each time they are modified.

0 commit comments

Comments
 (0)