consistancy across docs, example, and config
This commit is contained in:
		
							parent
							
								
									8454b30a26
								
							
						
					
					
						commit
						9773dc3474
					
				
							
								
								
									
										38
									
								
								README.md
								
								
								
								
							
							
						
						
									
										38
									
								
								README.md
								
								
								
								
							| 
						 | 
					@ -24,6 +24,7 @@ When you use this template, you should update the following with your informatio
 | 
				
			||||||
- [ ] Change the favicon in `public`
 | 
					- [ ] Change the favicon in `public`
 | 
				
			||||||
- [ ] Clean up the README
 | 
					- [ ] Clean up the README
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
### Project Structure
 | 
					### Project Structure
 | 
				
			||||||
 | 
					
 | 
				
			||||||
```
 | 
					```
 | 
				
			||||||
| 
						 | 
					@ -33,9 +34,7 @@ src/                                <-- your source code
 | 
				
			||||||
    js/                             <-- processed javascript files
 | 
					    js/                             <-- processed javascript files
 | 
				
			||||||
    public/                         <-- unprocessed static `/` assets
 | 
					    public/                         <-- unprocessed static `/` assets
 | 
				
			||||||
    components/                     <-- riots components
 | 
					    components/                     <-- riots components
 | 
				
			||||||
        hello-riot/
 | 
					        hello-riot.riot             <-- example riot component
 | 
				
			||||||
            hello-riot.riot         <-- riot component
 | 
					 | 
				
			||||||
            hello-riot.spec.js      <-- component tests
 | 
					 | 
				
			||||||
    app.js                          <-- app initialization
 | 
					    app.js                          <-- app initialization
 | 
				
			||||||
index.html                          <-- START HERE
 | 
					index.html                          <-- START HERE
 | 
				
			||||||
vite.config.js                      <-- build configuration
 | 
					vite.config.js                      <-- build configuration
 | 
				
			||||||
| 
						 | 
					@ -43,43 +42,20 @@ README.md
 | 
				
			||||||
...                                 <-- misc project meta files
 | 
					...                                 <-- misc project meta files
 | 
				
			||||||
```
 | 
					```
 | 
				
			||||||
 | 
					
 | 
				
			||||||
### Mounting Strategy
 | 
					### Automatic Tag Registeration
 | 
				
			||||||
 | 
					
 | 
				
			||||||
This template automaticly registers and mounts riot components. These global **components** can in-turn can mount other nested components via `components` export option.
 | 
					Any `.riot` components under the `src/` directory are automatically registered, like `components/`. You can add, rename, restructure the folders as you like.
 | 
				
			||||||
 | 
					 | 
				
			||||||
#### Example
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
```
 | 
					 | 
				
			||||||
// my-page.riot
 | 
					 | 
				
			||||||
<my-page>
 | 
					 | 
				
			||||||
    <div>
 | 
					 | 
				
			||||||
        <example-component></example-component>
 | 
					 | 
				
			||||||
    </div>
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    <script>
 | 
					 | 
				
			||||||
        import Example from './example-component/example-component.riot';
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        export default {
 | 
					 | 
				
			||||||
            components: {
 | 
					 | 
				
			||||||
                Example
 | 
					 | 
				
			||||||
            }
 | 
					 | 
				
			||||||
        }
 | 
					 | 
				
			||||||
    </script>
 | 
					 | 
				
			||||||
</my-page>
 | 
					 | 
				
			||||||
```
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
> SEE: `/src/app.js` for more information
 | 
					> SEE: `/src/app.js` for more information
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
## NPM Scripts
 | 
					## NPM Scripts
 | 
				
			||||||
 | 
					
 | 
				
			||||||
- `npm run dev` - Starts the development server at port 3000
 | 
					- `npm run dev` - Starts the development server at port 5173
 | 
				
			||||||
- `npm run build` - Builds the application in a dist folder
 | 
					- `npm run build` - Builds the application in a dist folder
 | 
				
			||||||
- `npm run preview` - Serves the build files (dist folder) locally at port 5000
 | 
					- `npm run preview` - Serves the build files (dist folder) locally at port 5173
 | 
				
			||||||
 | 
					
 | 
				
			||||||
> Note that if after this last command you do not see anything, you can use instead this other command:
 | 
					> See [ViteJS Documentation](https://vitejs.dev/) for more information
 | 
				
			||||||
 | 
					 | 
				
			||||||
`npm run preview --host` - You should then be able to see your files locally at port 5000
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
## License
 | 
					## License
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -12,7 +12,7 @@
 | 
				
			||||||
        <h2>Getting Started</h2>
 | 
					        <h2>Getting Started</h2>
 | 
				
			||||||
        <p>
 | 
					        <p>
 | 
				
			||||||
            This page is found at <br/>
 | 
					            This page is found at <br/>
 | 
				
			||||||
            <code>src/components/hello-riot/hello-riot.riot</code>
 | 
					            <code>src/components/hello-riot.riot</code>
 | 
				
			||||||
            <p>
 | 
					            <p>
 | 
				
			||||||
                and is auto-registered via <br/>
 | 
					                and is auto-registered via <br/>
 | 
				
			||||||
                <code>src/app.js</code>
 | 
					                <code>src/app.js</code>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -2,6 +2,6 @@ import { defineConfig } from "vite";
 | 
				
			||||||
import riot from 'rollup-plugin-riot';
 | 
					import riot from 'rollup-plugin-riot';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export default defineConfig({
 | 
					export default defineConfig({
 | 
				
			||||||
    plugins: [{...riot(), enforce: 'pre'}],
 | 
					    plugins: [riot()],
 | 
				
			||||||
    publicDir: 'src/public'
 | 
					    publicDir: 'src/public'
 | 
				
			||||||
});
 | 
					});
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
		Reference in New Issue