GithubHelp home page GithubHelp logo

bencodezen / vuepress-blog-boilerplate Goto Github PK

View Code? Open in Web Editor NEW
221.0 7.0 121.0 2.07 MB

An ever-evolving and opinionated dev environment for people who want to use VuePress to power their blogs.

Home Page: https://vuepress-blog-boilerplate.bencodezen.io/

Vue 75.00% JavaScript 25.00%
vuejs vuepress vuepress-blog vue static-site-generator blog

vuepress-blog-boilerplate's Introduction

VuePress Blog Boilerplate (Deprecated)

Status: Deprecated Version Netlify Status

This is a deprecated opinionated architecture that uses VuePress v1.0.0-alpha to power a blogging platform.

Purpose

To provide a blueprint of how blogging is possible with VuePress v1.0.0-alpha and empower you with enough boilerplate so you feel comfortable customizing it to your liking.

Why is it deprecated?

As my work with OSS expands, I wanted the flexibility to switch tech stacks as the requirements for my own blog / site requirements increase. As a result, I do not have the time to maintain this one since it would be a separate effort from my current OSS work.

To follow the latest, you can follow the new repo at Ben's Blog Boilerplate.

Features

  • Write posts in Markdown
  • Basic pagination sorted by most recent posts
  • Ability to search for posts via headings within the post
  • Archived posts page
  • Basic scheduling for future publishing
  • Basic tagging for posts
  • Automatic RSS feed generation
  • Easily integrate Google Analytics

Getting Started

Prerequisites

  • NodeJS 12
  • yarn (Recommended)
  • Basic knowledge of navigating the terminal

Installation

If your plan is follow the tutorial all the way through to deployment, make sure you fork this project instead of simply cloning it!

In your terminal, navigate to the desired directory where you want this project to live.

# Clone the repo for local development
git clone https://github.com/bencodezen/vuepress-blog-boilerplate.git

# Change directory into project
cd vuepress-blog-boilerplate

# Install dependencies
yarn

# Run local server
yarn dev

You should now be able to visit http://localhost:8080!

Documentation

To check out the tutorial and docs, check out the guide.

Examples

Hat Tip

For those familiar with the Vue.js ecosystem, you might be reminded of Chris Fritz's Vue Enterprise Boilerplate and you would be absolutely right. I thought the concept was brilliant and wanted to do something similar for the VuePress ecosystem since blogging is something that still requires a fair amount of configuration and knowledge in order to get started.

And in case you didn't know, Chris Fritz is one of the core contributors to the incredible Vue.js docs that we all love so much. So if you would like to help support him so he can spend more time on creating awesome content for the Vue.js community, please support him by becoming a sponsor on Patreon.

vuepress-blog-boilerplate's People

Contributors

bencodezen avatar benwrk avatar danhogan avatar dependabot[bot] avatar jonghunbok avatar lhsazevedo avatar nivek92 avatar plockparty avatar unbiased-dev avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar

vuepress-blog-boilerplate's Issues

More props inside BlogPostList

More props likes:

  • count: Number of posts to display
  • after: Do not show the first x posts and show the following ones
  • reverse: Display post starting from the oldest

For example count=5 after=5 displays posts 5 to 10

Get the date from the url of the .md file like Jekyll

Jekyll uses a convention to name the files:

yyyy-mm-dd-slug.md

With this convention the files are sorted in the folder automatically.
It also takes the date from the url without having to add it inside the file and the slug to generate the url of the file inside the web.

Then, In the BlogPostPreview we will need a variable to display the slug (To create the router link to the post)

If the files could be created this way, many Jekyll users could switch to Vuepress.

See posts grouped by month

Users should be able to have an archive widget the shows their posts by month (and maybe event count!)

Document sidebar config

Write examples for how to configure the sidebar

Notes:

  • README sidebar config overrides the config.js for sidebar
  • Takes a series of links but not the text

Cannot find module 'moment'

I tried running this boilerplate but I didn't see anything on the localhost:8000 When I investigated I found this on the console

Screenshot_2020-10-31_20-11-36

This is due to missing dependency moment and I was successful to run this after adding dependency. I would love to send a PR to fix this. Although, this is a very small fix. Also, I always wanted to get started with open-source I think I can make my start from here ๐Ÿ˜„ However, it may sound like reviewing code and sparing time from your schedule to review. But I really want to make a start from here. Will wait for your desision.. :)

Error encoutering theme

asciicast

There is an unknown error when running vuepress dev.
Some of the fonts on the website and also many pages are broken.

Cannot find module .vuepress/theme

When running your boilerplate, an error/warning show up regarding the theme.
When running below command you easily se the issue.

$ vuepress dev --debug --no-clear-screen src
...
tip Apply local theme at /home/kerwood/Git/vuepress-app/src/.vuepress/theme...
debug Error: Cannot find module '/home/kerwood/Git/vuepress-app/src/.vuepress/theme'
Require stack:
- /home/kerwood/Git/vuepress-app/node_modules/@vuepress/shared-utils/lib/moduleResolver.js
- /home/kerwood/Git/vuepress-app/node_modules/@vuepress/shared-utils/lib/index.js
- /home/kerwood/Git/vuepress-app/node_modules/vuepress/lib/checkEnv.js
- /home/kerwood/Git/vuepress-app/node_modules/vuepress/cli.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:980:15)
    at Function.Module._load (internal/modules/cjs/loader.js:862:27)
    at Module.require (internal/modules/cjs/loader.js:1042:19)
    at require (internal/modules/cjs/helpers.js:77:18)
    at ModuleResolver.resolvePathPackage (/home/kerwood/Git/vuepress-app/node_modules/@vuepress/shared-utils/lib/moduleResolver.js:126:40)
    at Object.tryChain [as default] (/home/kerwood/Git/vuepress-app/node_modules/@vuepress/shared-utils/lib/tryChain.js:13:24)
    at ModuleResolver.resolve (/home/kerwood/Git/vuepress-app/node_modules/@vuepress/shared-utils/lib/moduleResolver.js:84:44)
    at PluginAPI.normalizePlugin (/home/kerwood/Git/vuepress-app/node_modules/@vuepress/core/lib/node/plugin-api/index.js:121:39)
    at resolveTheme (/home/kerwood/Git/vuepress-app/node_modules/@vuepress/core/lib/node/loadTheme.js:126:23)
    at loadTheme (/home/kerwood/Git/vuepress-app/node_modules/@vuepress/core/lib/node/loadTheme.js:36:17)
    at App.process (/home/kerwood/Git/vuepress-app/node_modules/@vuepress/core/lib/node/App.js:105:21)
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
    at async dev (/home/kerwood/Git/vuepress-app/node_modules/@vuepress/core/lib/index.js:17:3) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/home/kerwood/Git/vuepress-app/node_modules/@vuepress/shared-utils/lib/moduleResolver.js',
    '/home/kerwood/Git/vuepress-app/node_modules/@vuepress/shared-utils/lib/index.js',
    '/home/kerwood/Git/vuepress-app/node_modules/vuepress/lib/checkEnv.js',
    '/home/kerwood/Git/vuepress-app/node_modules/vuepress/cli.js'
  ]
}
warning An error was encountered in theme "/home/kerwood/Git/vuepress-app/src/.vuepress/theme"
tip Apply theme local ...
debug theme local /home/kerwood/Git/vuepress-app/src/.vuepress/theme
debug parentTheme undefined undefined
...

I cant really figure out the issue.

Custom pages using Vue templating instead of markdown

What I'm trying to do is create a Photos page that displays items from an Instagram feed, using a combination of plugins and Vue templating.

The documentation currently makes it easy to spin up a static page using markdown, but doesn't seem to cover creating non-md driven pages. Is this even possible with Vuepress/Blog Boilerplate?

Guidance would be much appreciated!

"Error: EACCESS: permission denied" when Running "npm run dev"

I'm having an issue where when I try to run npm run dev I'm getting a permissions error:

coffeepostal@Adams-Mac-Pro:~/Code/vuepress-blog-boilerplate$ npm run dev

> [email protected] dev /Users/coffeepostal/Code/vuepress-blog-boilerplate
> vuepress dev src

wait Extracting site metadata...
Error: EACCES: permission denied, mkdir '/Users/coffeepostal/Code/vuepress-blog-boilerplate/node_modules/@vuepress/core/.temp'
    at Object.mkdirSync (fs.js:753:3)
    at Object.mkdirsSync (/Users/coffeepostal/Code/vuepress-blog-boilerplate/node_modules/fs-extra/lib/mkdirs/mkdirs-sync.js:31:9)
    at createTemp (/Users/coffeepostal/Code/vuepress-blog-boilerplate/node_modules/@vuepress/core/lib/prepare/AppContext.js:464:8)
    at new AppContext (/Users/coffeepostal/Code/vuepress-blog-boilerplate/node_modules/@vuepress/core/lib/prepare/AppContext.js:51:37)
    at Function.getInstance (/Users/coffeepostal/Code/vuepress-blog-boilerplate/node_modules/@vuepress/core/lib/prepare/AppContext.js:28:30)
    at prepare (/Users/coffeepostal/Code/vuepress-blog-boilerplate/node_modules/@vuepress/core/lib/prepare/index.js:16:33)
    at prepareServer (/Users/coffeepostal/Code/vuepress-blog-boilerplate/node_modules/@vuepress/core/lib/dev.js:28:32)
    at module.exports (/Users/coffeepostal/Code/vuepress-blog-boilerplate/node_modules/@vuepress/core/lib/dev.js:4:40)
    at args (/Users/coffeepostal/Code/vuepress-blog-boilerplate/node_modules/vuepress/lib/util.js:35:12)
    at CAC.cli.command.option.option.option.option.option.option.option.option.action (/Users/coffeepostal/Code/vuepress-blog-boilerplate/node_modules/vuepress/lib/registerCoreCommands.js:34:23)
    at CAC.runMatchedCommand (/Users/coffeepostal/Code/vuepress-blog-boilerplate/node_modules/cac/dist/index.js:787:38)
    at CAC.parse (/Users/coffeepostal/Code/vuepress-blog-boilerplate/node_modules/cac/dist/index.js:707:18)
    at CLI (/Users/coffeepostal/Code/vuepress-blog-boilerplate/node_modules/vuepress/lib/util.js:23:7)
    at process._tickCallback (internal/process/next_tick.js:68:7)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] dev: `vuepress dev src`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/coffeepostal/.npm/_logs/2019-02-26T06_15_43_636Z-debug.log

I initially got an error on install, but running it via sudo cleared that up. I read the Unexpected end of JSON input while parsing issue, and cleaned my NPM cache, but I'm still getting the error. Additionally, here's the log file that is referenced at the end of the error out:

0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'run', 'dev' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'predev', 'dev', 'postdev' ]
5 info lifecycle [email protected]~predev: [email protected]
6 info lifecycle [email protected]~dev: [email protected]
7 verbose lifecycle [email protected]~dev: unsafe-perm in lifecycle true
8 verbose lifecycle [email protected]~dev: PATH: /usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/Users/coffeepostal/Code/vuepress-blog-boilerplate/node_modules/.bin:/Library/Frameworks/Python.framework/Versions/3.7/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Library/Frameworks/Mono.framework/Versions/Current/Commands
9 verbose lifecycle [email protected]~dev: CWD: /Users/coffeepostal/Code/vuepress-blog-boilerplate
10 silly lifecycle [email protected]~dev: Args: [ '-c', 'vuepress dev src' ]
11 silly lifecycle [email protected]~dev: Returned: code: 1  signal: null
12 info lifecycle [email protected]~dev: Failed to exec dev script
13 verbose stack Error: [email protected] dev: `vuepress dev src`
13 verbose stack Exit status 1
13 verbose stack     at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:301:16)
13 verbose stack     at EventEmitter.emit (events.js:189:13)
13 verbose stack     at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
13 verbose stack     at ChildProcess.emit (events.js:189:13)
13 verbose stack     at maybeClose (internal/child_process.js:970:16)
13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:259:5)
14 verbose pkgid [email protected]
15 verbose cwd /Users/coffeepostal/Code/vuepress-blog-boilerplate
16 verbose Darwin 17.7.0
17 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "dev"
18 verbose node v10.15.1
19 verbose npm  v6.8.0
20 error code ELIFECYCLE
21 error errno 1
22 error [email protected] dev: `vuepress dev src`
22 error Exit status 1
23 error Failed at the [email protected] dev script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]

I'm still fairly new to Vue, so this may be an old hat issue, but it's stumping me. Thanks!

build fails

Hi Nick

great tool for blog creation .. I've been testing it out locally over the weekend and then tried to publish on Netlify and ran into trouble.

11:18:14 AM: git clone https://github.com/raspberry-pi-dev/raspi-blog
11:18:15 AM: Preparing Git Reference refs/heads/master
11:18:15 AM: Error checking out submodules: fatal: No url found for submodule path 'vuepress-blog-boilerplate' in .gitmodules
11:18:15 AM: Failing build: Failed to prepare repo
11:18:15 AM: failed during stage 'preparing repo': Error checking out submodules: fatal: No url found for submodule path 'vuepress-blog-boilerplate' in .gitmodules
: exit status 128

I've tried this two ways:

  1. Cloning the repo and then removing the upstream. I did this with the repo https://github.com/raspberry-pi-dev/raspi-blog at first and I got error the message above
  2. Tried again with something more vanilla. I just made a simple fork of your repo at https://github.com/raspberry-pi-dev/vuepress-blog-boilerplate then pushed into the blog directory a few md files and jpgs

Both of these work fine locally running sudo vuepress dev src

But when I push them to github the Netlify build fails. The same Netlify build process & settings that I use for other vuepress (non-blog) website

Page component layout is broken

The layout is missing max-width and padding. Adding the .content class to the <Content /> in the <Page> component fixes the issue.

Without .content class:
Before

With:
After

VuePress Blog out of the Box page layout issue

Hello - I'm following along the tutorial but quickly run into trouble.

node --version
v11.6.0
npm --version
6.10.1

git clone https://github.com/bencodezen/vuepress-blog-boilerplate.git
cd vuepress-blog-boilerplate
npm install
npm run dev

This is what I see:
The Homepage looks as expected:
1-homepage src--README md

CSS renders quite different than in ./preview.png included in the repo:
2-blog src--blog--README md

The custom container displays ::: tip [text] :::
4-my-fourth-post

Any ideas why this might be the case?

Missing posts on certain browsers

I've run into a strange bug that prevents certain posts from showing up depending on the browser being used. I currently have 3 posts set up and they all show up as expected locally, as well as for Chrome and Firefox. However, for desktop and mobile safari, the second post doesn't show in view or in the DOM. I do notice upon rapid refresh a flicker of the second post which further adds to the mystery.

The site can be tested by going to https://blog.kamicrafted.com/ on Chrome vs Safari.


Screenshots of the difference:

Chrome
image

Safari ("Setting up LEMP and HTTPS/SSL on Digital Ocean" is missing)
image

ReferenceError: window is not defined

I forked to https://github.com/kaihendry/vuepress-blog-boilerplate and try to deploy to netlify

11:28:53 AM: Build ready to start
11:28:56 AM: build-image version: 84aca9ba39e0ee86ba194760fbfc51a808f62543
11:28:56 AM: buildbot version: 1ac64ca11e029436ed45ac81a38b9839778ec314
11:28:57 AM: Fetching cached dependencies
11:28:57 AM: Failed to fetch cache, continuing with build
11:28:57 AM: Starting to prepare the repo for build
11:28:57 AM: No cached dependencies found. Cloning fresh repo
11:28:57 AM: git clone https://github.com/kaihendry/vuepress-blog-boilerplate
11:28:58 AM: Preparing Git Reference refs/heads/master
11:28:58 AM: Starting build script
11:28:58 AM: Installing dependencies
11:28:59 AM: Downloading and installing node v8.15.0...
11:29:00 AM: Downloading https://nodejs.org/dist/v8.15.0/node-v8.15.0-linux-x64.tar.xz...
11:29:00 AM: 
#
11:29:00 AM:                                      1.4%
11:29:00 AM: #
11:29:00 AM: ##########
11:29:00 AM:                                                              16.3%
11:29:00 AM: 
########################################
11:29:00 AM: ##                                59.2%
11:29:00 AM: 
#####################################################
11:29:00 AM: ################### 100.0%
11:29:00 AM: Computing checksum with sha256sum
11:29:00 AM: Checksums matched!
11:29:03 AM: Now using node v8.15.0 (npm v6.4.1)
11:29:04 AM: Attempting ruby version 2.3.6, read from environment
11:29:05 AM: Using ruby version 2.3.6
11:29:05 AM: Using PHP version 5.6
11:29:05 AM: Started restoring cached node modules
11:29:05 AM: Finished restoring cached node modules
11:29:05 AM: Started restoring cached yarn cache
11:29:05 AM: Finished restoring cached yarn cache
11:29:05 AM: Installing yarn at version 1.3.2
11:29:05 AM: Installing Yarn!
11:29:05 AM: > Downloading tarball...
11:29:05 AM: [1/2]: https://yarnpkg.com/downloads/1.3.2/yarn
11:29:05 AM: -v1.3.2.tar.gz --> /tmp/yarn.tar.gz.mxkTjkVH0X
11:29:05 AM:   % Total    % Received % Xferd  Ave
11:29:05 AM: rage Speed   Time    Time     Time  Current
11:29:05 AM:                                  Dloa
11:29:05 AM: d  Upload   Total   Spent    Left  Speed
11:29:05 AM:  0     0    0     0    0     0
11:29:05 AM:    0      0 --:--:-- --:
11:29:05 AM: --:-- --:--:--     0
11:29:05 AM: 
100    91  100    91    0     0
11:29:05 AM:   652      0 --:--:-- --:--:-- --:--:--   654
11:29:05 AM: 
  0     0    0     0    0     0      0
11:29:05 AM:   0 --:--:-- --:--:-- --:--:--     0
11:29:05 AM: 
  0     0    0   608    0     0   1854      0 --:--:-- --:--:-- --:--:--  3823
11:29:06 AM: 
100  865k  100  865k    0     0  1270k
11:29:06 AM:     0 --:--:-- --:--:-- --:--:-- 1270k
11:29:06 AM: [2/2]: https://yarnp
11:29:06 AM: kg.com/downloads/1.3.2/yarn-v1.3.2.tar.gz.asc --> /tmp/yarn.tar.gz.mxkTjkVH0X.asc
11:29:06 AM: 
100    95  100    95    0     0
11:29:06 AM:    2456      0 --:--:-- --:--:-- --:--:--  2456
11:29:06 AM: 
  0     0    0   612    0     0   4106
11:29:06 AM:   0 --:--:-- --:--:-- --:--:--  4106
11:29:06 AM: 1
11:29:06 AM: 00  1027
11:29:06 AM:  100  1027    0     0   5393      0 --:--:-- --:--:-- --:--:--  5393
11:29:06 AM: > Verifying integrity...
11:29:06 AM: gpg: Signature made Thu 02 Nov 2017 04:44:10 PM UTC using RSA key ID FD2497F5
11:29:06 AM: gpg: Good signature from "Yarn Packaging <[email protected]>"
11:29:06 AM: gpg: Note: This key has expired!
11:29:06 AM: Primary key fingerprint:
11:29:06 AM:  72EC F46A 56B4 AD39 C907  BBB7 1646 B01B 86E5 0310
11:29:06 AM:      Subkey fingerprint: 6A01 0C51 6600 6599 AA17  F081 46C2 130D FD24 97F5
11:29:06 AM: > GPG signature looks good
11:29:06 AM: > Extracting to ~/.yarn...
11:29:06 AM: > Adding to $PATH...
11:29:06 AM: > We've added the following to your /opt/buildhome/.profile
11:29:06 AM: > If this isn't the profile of your current shell then please add the following to your correct profile:
11:29:06 AM: export PATH="$HOME/.yarn/bin:$HOME/.config/yarn/global/node_modules/.bin:$PATH"
11:29:06 AM: 
11:29:07 AM: > Successfully installed Yarn 1.3.2! Please open another terminal where the `yarn` command will now be available.
11:29:07 AM: Installing NPM modules using Yarn version 1.3.2
11:29:08 AM: yarn install v1.3.2
11:29:08 AM: [1/4] Resolving packages...
11:29:09 AM: [2/4] Fetching packages...
11:29:20 AM: info [email protected]: The platform "linux" is incompatible with this module.
11:29:20 AM: info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
11:29:20 AM: [3/4] Linking dependencies...
11:29:20 AM: warning "vuepress > @vuepress/core > @vue/babel-preset-app > @vue/[email protected]" has unmet peer dependency "@vue/babel-helper-vue-jsx-merge-props@^0.1.0".
11:29:20 AM: warning "vuepress > @vuepress/core > @vue/babel-preset-app > @vue/babel-preset-jsx > @vue/[email protected]" has incorrect peer dependency "@vue/babel-helper-vue-jsx-merge-props@^0.1.0".
11:29:20 AM: warning "vuepress > @vuepress/core > mini-css-extract-plugin > schema-utils > [email protected]" has unmet peer dependency "ajv@>=5.0.0".
11:29:24 AM: [4/4] Building fresh packages...
11:29:24 AM: Done in 16.71s.
11:29:25 AM: NPM modules installed using Yarn
11:29:25 AM: Started restoring cached go cache
11:29:25 AM: Finished restoring cached go cache
11:29:25 AM: unset GOOS;
11:29:25 AM: unset GOARCH;
11:29:25 AM: export GOROOT='/opt/buildhome/.gimme/versions/go1.10.linux.amd64';
11:29:25 AM: export PATH="/opt/buildhome/.gimme/versions/go1.10.linux.amd64/bin:${PATH}";
11:29:25 AM: go version >&2;
11:29:25 AM: export GIMME_ENV='/opt/buildhome/.gimme/env/go1.10.linux.amd64.env';
11:29:25 AM: go version go1.10 linux/amd64
11:29:25 AM: Installing missing commands
11:29:25 AM: Verify run directory
11:29:25 AM: Executing user command: vuepress build docs
11:29:26 AM: wait Extracting site metadata...
11:29:26 AM: tip Apply theme @vuepress/theme-default
11:29:26 AM: tip Apply plugin @vuepress/register-components (i.e. "@vuepress/plugin-register-components") ...
11:29:26 AM: tip Apply plugin @vuepress/active-header-links (i.e. "@vuepress/plugin-active-header-links") ...
11:29:26 AM: tip Apply plugin @vuepress/search (i.e. "@vuepress/plugin-search") ...
11:29:26 AM: tip Apply plugin @vuepress/google-analytics (i.e. "@vuepress/plugin-google-analytics") ...
11:29:26 AM: tip Apply plugin rss (i.e. "vuepress-plugin-rss") ...
11:29:28 AM: [03:29:28] Compiling Client
11:29:28 AM: [03:29:28] Compiling Server
11:29:37 AM: [03:29:37] Compiled Server in 9s
11:29:43 AM: [03:29:43] Compiled Client in 15s
11:29:43 AM: wait Rendering static HTML...
11:29:43 AM: 
11:29:43 AM: 
11:29:43 AM: Rendering page: /
11:29:43 AM: ReferenceError: window is not defined
11:29:43 AM:     at inject (server-bundle.js:6630:8)
11:29:43 AM:     at server-bundle.js:7125:9
11:29:43 AM:     at Array.forEach (<anonymous>)
11:29:43 AM:     at createApp (server-bundle.js:7123:19)
11:29:43 AM:     at module.exports.__webpack_exports__.default (server-bundle.js:7164:22)
11:29:43 AM:     at new Promise (<anonymous>)
11:29:43 AM:     at new F (server-bundle.js:174:28)
11:29:43 AM:     at module.exports.__webpack_exports__.default (server-bundle.js:7163:10)
11:29:43 AM:     at /opt/build/repo/node_modules/vue-server-renderer/build.js:8456:15
11:29:43 AM:     at new Promise (<anonymous>)
11:29:43 AM:     at /opt/build/repo/node_modules/vue-server-renderer/build.js:8418:14
11:29:43 AM:     at Object.renderToString (/opt/build/repo/node_modules/vue-server-renderer/build.js:8594:9)
11:29:43 AM:     at renderPage (/opt/build/repo/node_modules/@vuepress/core/lib/build.js:151:29)
11:29:43 AM:     at build (/opt/build/repo/node_modules/@vuepress/core/lib/build.js:76:26)
11:29:43 AM:     at <anonymous>
11:29:43 AM: 
11:29:43 AM: Rendering page: /learn/
11:29:43 AM: ReferenceError: window is not defined
11:29:43 AM:     at inject (server-bundle.js:6630:8)
11:29:43 AM:     at server-bundle.js:7125:9
11:29:43 AM:     at Array.forEach (<anonymous>)
11:29:43 AM:     at createApp (server-bundle.js:7123:19)
11:29:43 AM:     at module.exports.__webpack_exports__.default (server-bundle.js:7164:22)
11:29:43 AM:     at new Promise (<anonymous>)
11:29:43 AM:     at new F (server-bundle.js:174:28)
11:29:43 AM:     at module.exports.__webpack_exports__.default (server-bundle.js:7163:10)
11:29:43 AM:     at /opt/build/repo/node_modules/vue-server-renderer/build.js:8456:15
11:29:43 AM:     at new Promise (<anonymous>)
11:29:43 AM:     at /opt/build/repo/node_modules/vue-server-renderer/build.js:8418:14
11:29:43 AM:     at Object.renderToString (/opt/build/repo/node_modules/vue-server-renderer/build.js:8594:9)
11:29:43 AM:     at renderPage (/opt/build/repo/node_modules/@vuepress/core/lib/build.js:151:29)
11:29:43 AM:     at build (/opt/build/repo/node_modules/@vuepress/core/lib/build.js:76:26)
11:29:43 AM:     at <anonymous>
11:29:43 AM: 
11:29:43 AM: Rendering page: /404.html
11:29:43 AM: ReferenceError: window is not defined
11:29:43 AM:     at inject (server-bundle.js:6630:8)
11:29:43 AM:     at server-bundle.js:7125:9
11:29:43 AM:     at Array.forEach (<anonymous>)
11:29:43 AM:     at createApp (server-bundle.js:7123:19)
11:29:43 AM:     at module.exports.__webpack_exports__.default (server-bundle.js:7164:22)
11:29:43 AM:     at new Promise (<anonymous>)
11:29:43 AM:     at new F (server-bundle.js:174:28)
11:29:43 AM:     at module.exports.__webpack_exports__.default (server-bundle.js:7163:10)
11:29:43 AM:     at /opt/build/repo/node_modules/vue-server-renderer/build.js:8456:15
11:29:43 AM:     at new Promise (<anonymous>)
11:29:43 AM:     at /opt/build/repo/node_modules/vue-server-renderer/build.js:8418:14
11:29:43 AM:     at Object.renderToString (/opt/build/repo/node_modules/vue-server-renderer/build.js:8594:9)
11:29:43 AM:     at renderPage (/opt/build/repo/node_modules/@vuepress/core/lib/build.js:151:29)
11:29:43 AM:     at build (/opt/build/repo/node_modules/@vuepress/core/lib/build.js:76:26)
11:29:43 AM:     at <anonymous>
11:29:43 AM: 
11:29:43 AM: 
11:29:43 AM: RSS has been generated!
11:29:43 AM: success Generated static files in public.
11:29:43 AM: Caching artifacts
11:29:43 AM: Started saving node modules
11:29:43 AM: Finished saving node modules
11:29:43 AM: Started saving yarn cache
11:29:43 AM: Finished saving yarn cache
11:29:43 AM: Started saving pip cache
11:29:43 AM: Finished saving pip cache
11:29:43 AM: Started saving emacs cask dependencies
11:29:43 AM: Finished saving emacs cask dependencies
11:29:43 AM: Started saving maven dependencies
11:29:43 AM: Finished saving maven dependencies
11:29:43 AM: Started saving boot dependencies
11:29:43 AM: Finished saving boot dependencies
11:29:43 AM: Started saving go dependencies
11:29:43 AM: Finished saving go dependencies
11:29:44 AM: Cached node version v8.15.0
11:29:44 AM: Build script success
11:29:44 AM: Failing build: Failed to build site
11:29:44 AM: failed during stage 'building site': Deploy directory 'docs/.vuepress/dist' does not exist
11:29:44 AM: Finished processing build request in 48.095245028s
11:29:44 AM: Shutting down logging, 0 messages pending

Create a blog theme

The current theme leaves something to be less than desirable for blogging. The idea is to give it a fresh coat of paint which will open up doors for guides on how to customize different pieces of the site.

Cannot load image in blog or image tag

I am probably missing somethings and I'm sorry if I'm being a bit daft. This isn't exactly an issue (I think) but I can't get any of the images to load in a blog post that's in the public folder.

When I run your blog it works fine. When I run the boiler plate code I don't see the images in the post. I copied over the exact image structure for the github contributions blog you did.

docs

  • .vuepress
    • public
      • images
        • 2019-02-26-contribution-graph.png

But when I reference it in the .md file

![My GitHub contribution graph](/images/2019/2019-02-26-contribution-graph.png)

It fails to load the image. Error

2019-02-26-contribution-graph.png:1 GET http://localhost:8080/images/2019/2019-02-26-contribution-graph.png 404 (Not Found)

I resorted to trying to use your image from original blog to see if I can get it to work based on the exact code you have and it's not working. I've used many other images with simpler names and none of them load.

Is there anything that I'm missing? First time VuePress user, a little bit above beginner level Vue developer.

I also have the problem of using the tag in the BlogPostPreview.vue file binding to an image with the same path and it fails as well.

Follow and Share Buttons

Hi!.

If we could have a plugin for VuePress that allows me to choose from a list, several social media for sharing posts and follow buttons for the blog. So by default it'll has Facebook, Twitter, Linkedin, WhatsApp, Telegram and Email. But through the configuration I'll be able to add more such as: VK, Github, Instagram, Tumblr, Google+, Weibo, etc...

That's would be awesome and headless for non-programmers.
Thanks.

build fails

I built a project based on the boilerplate.
When I am running it on dev mode- everything is fine.
When I am trying to deploy with "npm run build" it fails.
Rendering page: /[Vue warn]: Failed to resolve async component: () => Promise.all(/* import() */[webpack_require.e(0), webpack_require.e(1), webpack_require.e(3), webpack_require.e(7)]).then(webpack_require.bind(null, 212))
Reason: ReferenceError: document is not defined
error Error rendering /: false
undefined
Error: render function or template not defined in component: anonymous
at normalizeRender (/var/www/html/mailshogun-vue/node_modules/vue-server-renderer/build.dev.js:8247:13)
at renderComponentInner (/var/www/html/mailshogun-vue/node_modules/vue-server-renderer/build.dev.js:8397:3)
at renderComponent (/var/www/html/mailshogun-vue/node_modules/vue-server-renderer/build.dev.js:8368:5)
at resolve (/var/www/html/mailshogun-vue/node_modules/vue-server-renderer/build.dev.js:8436:9)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: vuepress build src
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2019-07-17T14_39_13_348Z-debug.log

(it runs before fine with build). Did just minor changes.

list all posts with specific tag

Hey Ben,

thanks for sharing this project! ๐Ÿ˜ƒ

In the post meta there's a possibility to add tags. As far as I can see those aren't used anywhere otherwise?
I figured out how to display the tags on the post page itself. I'd like to link the tag to a page that lists all posts with that specific tag tho.
I see there's a selectedTags data item in the BlogPostList component. I just couldn't figure out how to use it.

Can you point me in the right direction on how to use the tags? Thanks! ๐Ÿ™‚

Make all config parameters explicit

Hey,
I think it would be good to have each configurable parameter explicitly in the themeConfig.
This saves time because one does not have to look through code what parameters can be set.

More vars to display inside BlogPostPreview

Personally, I have in my .md files more variables that I want to display in the post preview. For example I have a variable named icon to display icon near the post.

I think you can pass a variable called post to the parent (where the post preview is used). The post will be an object with all the variables inside the post. In this way the user can decide which parameters of the post he wants to show and how.

Take a look to this post It can be useful for you:

https://alligator.io/vuejs/scoped-component-slots/

Replacing homepage with Blog Post List page

Hi Ben, thanks so much for your work on this.

I've been trying to figure out a way to use the Posts page as the Homepage and haven't had much luck. (basically showing a list of x posts at the root domain rather than the static content that's currently the default).

Is this something that is possible currently? I'd imagine a lot of folks using this for their blog wanting to immediately serve up content rather than a splash/info page.

Any guidance you can provide would be much appreciated, thank you!

Sort content by its category

You have a folder to create post. I think is a better idea to have a folder called content. Inside thsi folder the user can create new folders to oder content automatically by his category.

For example if you create /content/posts/ and /content/notes/, automatically categorize the files within each folder without having to add within each file a variable with each category.

Then in the BlogPostList you can have a prop to pass a string with the category yo want to display for example category="notes" will render files inside /content/notes/ folder

SEO

Very important for many users. We need a form to display in the head section the post parameters like the title, description...

You have this implemented but I wonder if you have a way to put the variable you want from the posts. For example {{ $page.meta}}

Add config to generate sitemap.xml too

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.