Coder Social home page Coder Social logo

vuepress-plugin-autometa's Issues

Permalink is not reflected

Description

Autometa has not catch the rewritten by another extended function.

This problem may be a problem to be solved by the Vuepress core in the future, such as setting the execution order of plugins.

What do you think about this problem?

Temporary solution

before

module.exports = ( plugin_options, context ) => ({
  extendPageData ( $page ) {
    const { frontmatter } = $page;
    ...

after

module.exports = ( plugin_options, context ) => ({
  ready () {
    const { pages } = context
  
    pages.forEach( page => {
      const { frontmatter } = page;
      ...

Expected Behavior

/about.md

---
title: Hello
permalink: about-page
---

# About

output

/about-page/index.html

<!DOCTYPE html>
<head>
  <meta name="twitter:url" content="https://example.com/about-page/">
  ...

Actual Behavior

/about.md

---
title: Hello
permalink: about-page
---

# About

output

/about-page/index.html

<!DOCTYPE html>
<head>
  <meta name="twitter:url" content="https://example.com/about.html">
  ...

Your Environment

  • vuepress-plugin-autometa version: 0.1.10
  • vuepress version: 1.0.0-alpha.40
  • node version: 10.7.0
  • npm version: 6.6.0
  • OS: MacOS 10.14.2

sorry, I'm using translation.
love this plugin. thanks!

generated image URLs broken for urls computed by Vue e.g $withBase

Description

The VuePress documentation recommends to use $withBase() to include images when the site is deployed at a non root url:

<img :src="$withBase('/img/logo.svg')" alt="logo" />

Expected Behavior

I'd expect that the url is computed correctly, based on the vuepress config.

Actual Behavior

Generated is this:

<meta property="og:image" content="https://example.com/$withBase(">

Steps to Reproduce

Put the img tag as stated above in your md file.

Your Environment

  • vuepress-plugin-autometa version: 0.1.13
  • vuepress version : 1.2.0
  • OS : win

Front matter image source

Description

Better customisation of image source selection

Expected Behavior

I would be able to programatically choose the image source in frontmatter, using a string path or perhaps a function:

image_sources: [
    page => page.frontmatter.media.thumbnail || page.frontmatter.image
],

Actual Behavior

It seems the code only picks a frontmatter node called image but I want to pick one at media.thumbnail

Also, when the code moves on to use regex to grab a page tag, it ends up with:

<meta name="twitter:image" content="https://davestewart.co.uk/./screens/loading.png">

Also, note that this link shows a path relative the actual page - is there some way to get round this?

In my own code, I resolve the path and then require().

The compiled page (the image was just in markdown) actually shows this:

<img src="/assets/img/loading.143ab32a.png" alt="">

Steps to Reproduce

N/A

Your Environment

Sorry removed this as didn't think it was a bug before.

But, Node 12, latest everything else.

Great plugin, thanks for your hard work!

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.