Recently, I was assigned to develop a customized plugin for gitbook https://github.com/GitbookIO/gitbook to display the file by providing the path in the README.md , The plugin example is right here :https://github.com/GitbookIO/plugin ,the plugin is supposed to work like :
the link in the README.md : ["hello.java"](src/to/hello.java)=======> after build the gitbook ,it turns to
public class Hello{
public static void main(String []args){
System.out.println("Hello");
}
}
Then In my plugin package, I modify the index.js file like this
module.exports = {
book: {
assets: "./book",
js: [
"test.js"
],
css: [
"test.css"
],
html: {
"html:start": function() {
return "<!-- Start book "+this.options.title+" -->"
},
"html:end": function() {
return "<!-- End of book "+this.options.title+" -->"
},
"head:start": "<!-- head:start -->",
"head:end": "<!-- head:end -->",
"body:start": "<!-- body:start -->",
"body:end": "<!-- body:end -->"
}
},
hooks: {
// For all the hooks, this represent the current generator
// This is called before the book is generated
"init": function() {
console.log("init!");
},
// This is called after the book generation
"finish": function() {
console.log("finish!");
},
// The following hooks are called for each page of the book
// and can be used to change page content (html, data or markdown)
// Before parsing markdown
"page:before": function(page) {
console.log("============="+ page.content +"===============");
var pathlist= page.content.match(/\[\"[A-Za-z]*\.[A-Za-z]*\"\]\([A-Za-z\/\-\d]*\.[A-Za-z]*\)/g);
if (pathlist) {
console.log( "The length of the match array is " + pathlist.length +" and the content of the array is "+ pathlist);
}
if (pathlist && pathlist.length > 0){
for (index = 0; index <pathlist.length; index++){
var fs = require("node-fs");
var index1 = pathlist[index].indexOf("(");
var index2 = pathlist[index].indexOf(")");
var sub_string = pathlist[index].substr(index1+1,index2-index1-1);
var pathToFile = sub_string;
console.log(pathToFile);
if(fs.existsSync(pathToFile)){
console.log("@@@@@@@@@@@@@@@@"+ pathToFile);
if(fs.statSync(pathToFile)){
try {
fs.openSync(pathToFile, "r")
}catch(e){
console.log('Error:', e);
return;
}
console.log("Let's print out the source code below , Seeeeeeeeeeeeee");
var data = fs.readFileSync(pathToFile).toString();
console.log(data);
pathlist[index]=data;
}
};
}}
console.log("here is the results array:||||||||||||||||| " + pathlist +"|||||||||||||||||||||||||||||");
var pattern = /\[\"[A-Za-z]*\.[A-Za-z]*\"\]\([A-Za-z\/\-\d]*\.[A-Za-z]*\)/;
var input = page.content;
for (var i = 0; i < pathlist.length; i++) {
input = input.replace(pattern, "`"+pathlist[i]+"`");
}
page.content = input;
console.log(page.content);
return page;
},
"page": function(page) {
console.log("page");
},
"page:after": function(page) {
console.log("after");
}
}
};
then I add the plugin folder which I named "hello" in my node_modules folder and excute
npm install path/to/plugin-hello
in my book directory , I add the plugin configuration in the book.json
{
"plugins" : ["richquotes", "hello"],
"pluginsConfig":{
"richquotes" :{
"todos" : true,
"fixme" : true,
"info" : true
},
"hello": {}
}
}
When I build the gitbook the log is look like this:
C02KG1DGFFT3:gitbooktest v619896$ gitbook build ./
Starting build ...
init!
=============gitbooktobedeleted
==================
This is a gitbook for testing
> **todo**
>
["ContactController.java"](ContactController.java)
["web.xml"](src/to/web.xml)
===============
The length of the match array is 2 and the content of the array is ["ContactController.java"]
(ContactController.java),["web.xml"](src/to/web.xml)
ContactController.java
@@@@@@@@@@@@@@@@ContactController.java
##################
Let's print out the source code below , Seeeeeeeeeeeeee
public class ContactController{
public static void main(String []args){
System.out.println("Hello");
}
}
src/to/web.xml
@@@@@@@@@@@@@@@@src/to/web.xml
##################
Let's print out the source code below , Seeeeeeeeeeeeee
<%%%%?xml%%%%version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee
/web-app_3_0.xsd"
version="3.0">
</web-app>
here is the results array:||||||||||||||||| public class ContactController{
public static void main(String []args){
System.out.println("Hello");
}
},<%%%%?xml%%%%version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/n/javaee
/web-app_3_0.xsd"
version="3.0">
</web-app>|||||||||||||||||||||||||||||
gitbooktobedeleted
==================
This is a gitbook for testing
> **todo**
>
`public class ContactController{
public static void main(String []args){
System.out.println("Hello");
}
}`
`<%%%%?xml%%%%version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/n/javaee
/web-app_3_0.xsd"
version="3.0">
</web-app>`
page
after
finish!
Successfully built!
It looks like everything works fine !
but when I try to open the index.html it generated , the page content is "undefined " and nothing else !
Could anyone give me some hint ,where did I make the mistake ? I am really new to Javascript ! Thanks!
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent