Skip to content
This repository was archived by the owner on May 8, 2021. It is now read-only.

Commit 1b66bad

Browse files
committed
initialize gridsome site
1 parent e89baa0 commit 1b66bad

16 files changed

+8132
-0
lines changed

examples/gridsome/.gitignore

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
*.log
2+
.cache
3+
.DS_Store
4+
src/.temp
5+
node_modules
6+
dist
7+
.env
8+
.env.*

examples/gridsome/README.md

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
# Default starter for Gridsome
2+
3+
This is the project you get when you run `gridsome create new-project`.
4+
5+
### 1. Install Gridsome CLI tool if you don't have
6+
7+
`npm install --global @gridsome/cli`
8+
9+
### 2. Create a Gridsome project
10+
11+
1. `gridsome create my-gridsome-site` to install default starter
12+
2. `cd my-gridsome-site` to open the folder
13+
3. `gridsome develop` to start a local dev server at `http://localhost:8080`
14+
4. Happy coding 🎉🙌

examples/gridsome/gridsome.config.js

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
// This is where project configuration and plugin options are located.
2+
// Learn more: https://gridsome.org/docs/config
3+
4+
// Changes here require a server restart.
5+
// To restart press CTRL + C in terminal and run `gridsome develop`
6+
7+
module.exports = {
8+
siteName: 'Gridsome',
9+
plugins: []
10+
}

examples/gridsome/gridsome.server.js

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
// Server API makes it possible to hook into various parts of Gridsome
2+
// on server-side and add custom data to the GraphQL data layer.
3+
// Learn more: https://gridsome.org/docs/server-api
4+
5+
// Changes here require a server restart.
6+
// To restart press CTRL + C in terminal and run `gridsome develop`
7+
8+
module.exports = function (api) {
9+
api.loadSource(({ addContentType }) => {
10+
// Use the Data Store API here: https://gridsome.org/docs/data-store-api
11+
})
12+
13+
api.createPages(({ createPage }) => {
14+
// Use the Pages API here: https://gridsome.org/docs/pages-api
15+
})
16+
}

examples/gridsome/package.json

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"name": "gridsome",
3+
"private": true,
4+
"scripts": {
5+
"build": "gridsome build",
6+
"develop": "gridsome develop",
7+
"explore": "gridsome explore"
8+
},
9+
"dependencies": {
10+
"gridsome": "^0.6.0"
11+
}
12+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
Add components that will be imported to Pages and Layouts to this folder.
2+
Learn more about components here: https://gridsome.org/docs/components
3+
4+
You can delete this file.

examples/gridsome/src/favicon.png

29.9 KB
Loading
+50
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
<template>
2+
<div class="layout">
3+
<header class="header">
4+
<strong>
5+
<g-link to="/">{{ $static.metaData.siteName }}</g-link>
6+
</strong>
7+
<nav class="nav">
8+
<g-link class="nav__link" to="/">Home</g-link>
9+
<g-link class="nav__link" to="/about">About</g-link>
10+
</nav>
11+
</header>
12+
<slot/>
13+
</div>
14+
</template>
15+
16+
<static-query>
17+
query {
18+
metaData {
19+
siteName
20+
}
21+
}
22+
</static-query>
23+
24+
<style>
25+
body {
26+
font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
27+
margin:0;
28+
padding:0;
29+
line-height: 1.5;
30+
}
31+
32+
.layout {
33+
max-width: 760px;
34+
margin: 0 auto;
35+
padding-left: 20px;
36+
padding-right: 20px;
37+
}
38+
39+
.header {
40+
display: flex;
41+
justify-content: space-between;
42+
align-items: center;
43+
margin-bottom: 20px;
44+
height: 80px;
45+
}
46+
47+
.nav__link {
48+
margin-left: 20px;
49+
}
50+
</style>
+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
Layout components are used to wrap pages and templates. Layouts should contain components like headers, footers or sidebars that will be used across the site.
2+
3+
Learn more about Layouts: https://gridsome.org/docs/layouts
4+
5+
You can delete this file.

examples/gridsome/src/main.js

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
// This is the main.js file. Import global CSS and scripts here.
2+
// The Client API can be used here. Learn more: gridsome.org/docs/client-api
3+
4+
import DefaultLayout from '~/layouts/Default.vue'
5+
6+
export default function (Vue, { router, head, isClient }) {
7+
// Set default layout as a global component
8+
Vue.component('Layout', DefaultLayout)
9+
}

examples/gridsome/src/pages/About.vue

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<template>
2+
<Layout>
3+
<h1>About us</h1>
4+
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Error doloremque omnis animi, eligendi magni a voluptatum, vitae, consequuntur rerum illum odit fugit assumenda rem dolores inventore iste reprehenderit maxime! Iusto.</p>
5+
</Layout>
6+
</template>
7+
8+
<script>
9+
export default {
10+
metaInfo: {
11+
title: 'About us'
12+
}
13+
}
14+
</script>

examples/gridsome/src/pages/Index.vue

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
<template>
2+
<Layout>
3+
4+
<!-- Learn how to use images here: https://gridsome.org/docs/images -->
5+
<g-image alt="Example image" src="~/favicon.png" width="135" />
6+
7+
<h1>Hello, world!</h1>
8+
9+
<p>
10+
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Pariatur excepturi labore tempore expedita, et iste tenetur suscipit explicabo! Dolores, aperiam non officia eos quod asperiores
11+
</p>
12+
13+
<p class="home-links">
14+
<a href="https://gridsome.org/docs" target="_blank" rel="noopener">Gridsome Docs</a>
15+
<a href="https://github.com/gridsome/gridsome" target="_blank" rel="noopener">GitHub</a>
16+
</p>
17+
18+
</Layout>
19+
</template>
20+
21+
<script>
22+
export default {
23+
metaInfo: {
24+
title: 'Hello, world!'
25+
}
26+
}
27+
</script>
28+
29+
<style>
30+
.home-links a {
31+
margin-right: 1rem;
32+
}
33+
</style>

examples/gridsome/src/pages/README.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
Pages are usually used for normal pages or for listing items from a GraphQL collection.
2+
Add .vue files here to create pages. For example **About.vue** will be **site.com/about**.
3+
Learn more about pages: https://gridsome.org/docs/pages
4+
5+
You can delete this file.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
Templates for **GraphQL collections** should be added here.
2+
To create a template for a collection called `WordPressPost`
3+
create a file named `WordPressPost.vue` in this folder.
4+
5+
Learn more: https://gridsome.org/docs/templates
6+
7+
You can delete this file.

examples/gridsome/static/README.md

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
Add static files here. Files in this directory will be copied directly to `dist` folder during build. For example, /static/robots.txt will be located at https://yoursite.com/robots.txt.
2+
3+
This file should be deleted.

0 commit comments

Comments
 (0)