From 541b70dd45dd510f0e02805860971f5517a08c1d Mon Sep 17 00:00:00 2001 From: Mirko Tebaldi Date: Fri, 19 Apr 2019 09:38:32 +0200 Subject: [PATCH 1/4] Update README.md Clarified how to run example and expected output --- docs/guide/README.md | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/docs/guide/README.md b/docs/guide/README.md index 15485e25..9eb56c49 100644 --- a/docs/guide/README.md +++ b/docs/guide/README.md @@ -16,6 +16,8 @@ We will be using NPM throughout the guide, but feel free to use [Yarn](https://y ## Rendering a Vue Instance +Save the following code in a `.js` file, for example `render1.js` + ``` js // Step 1: Create a Vue instance const Vue = require('vue') @@ -41,6 +43,20 @@ renderer.renderToString(app).then(html => { }) ``` +To run the code, from the prompt console of your OS execute + +``` bash +node .\render1.js +``` + +You should see the following output. Row is duplicated if you keep both `re.dered.renderToString(..)`, otherwise you see only one row of output. + +``` +
Hello World
+
Hello World
+``` + + ## Integrating with a Server It is pretty straightforward when used inside a Node.js server, for example [Express](https://expressjs.com/): From 350b3eb7d7a0d94e64e508a2c89681073c8de4f3 Mon Sep 17 00:00:00 2001 From: Mirko Tebaldi Date: Fri, 19 Apr 2019 09:39:01 +0200 Subject: [PATCH 2/4] Update README.md --- docs/guide/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/guide/README.md b/docs/guide/README.md index 9eb56c49..98d70c04 100644 --- a/docs/guide/README.md +++ b/docs/guide/README.md @@ -49,7 +49,7 @@ To run the code, from the prompt console of your OS execute node .\render1.js ``` -You should see the following output. Row is duplicated if you keep both `re.dered.renderToString(..)`, otherwise you see only one row of output. +You should see the following output. Row is duplicated if you keep both `rendered.renderToString(..)`, otherwise you see only one row of output. ```
Hello World
From aebae90a9ae6ee1e9455de09788dd914b8c10e75 Mon Sep 17 00:00:00 2001 From: Mirko Tebaldi Date: Fri, 19 Apr 2019 09:41:12 +0200 Subject: [PATCH 3/4] Update README.md --- docs/guide/README.md | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/docs/guide/README.md b/docs/guide/README.md index 98d70c04..72a14559 100644 --- a/docs/guide/README.md +++ b/docs/guide/README.md @@ -65,6 +65,9 @@ It is pretty straightforward when used inside a Node.js server, for example [Exp npm install express --save ``` --- + +Save the following code in a `.js` file, for example `render2.js` + ``` js const Vue = require('vue') const server = require('express')() @@ -96,6 +99,20 @@ server.get('*', (req, res) => { server.listen(8080) ``` +To run the code, from the prompt console of your OS execute + +``` bash +node .\render2.js +``` + +Then open your browser at [http://localhost:8080 + +You should see no output in the console, but you'll see what follows in your browser + +``` +The visited URL is: / +``` + ## Using a Page Template When you render a Vue app, the renderer only generates the markup of the app. In the example we had to wrap the output with an extra HTML page shell. From 51c2fb4082a5fe61ae2eee7b4b23dbc373c9995f Mon Sep 17 00:00:00 2001 From: Mirko Tebaldi Date: Fri, 19 Apr 2019 09:42:12 +0200 Subject: [PATCH 4/4] Update README.md --- docs/guide/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/guide/README.md b/docs/guide/README.md index 72a14559..f9be2192 100644 --- a/docs/guide/README.md +++ b/docs/guide/README.md @@ -105,7 +105,7 @@ To run the code, from the prompt console of your OS execute node .\render2.js ``` -Then open your browser at [http://localhost:8080 +Then open your browser at [http://localhost:8080](http://localhost:8080) You should see no output in the console, but you'll see what follows in your browser