ハードコードされたURLを使用したこの単純な例では、Vue.jsコンポーネントがレンダリングされないため、プレーンhtmlがレンダリングされます。Phantom.jsを使用してPDFを生成しようとしたときにVue.jsがレンダリングされない
Phantom.jsはVue.jsで正常に動作するはずですか?
var webPage = require('webpage');
var page = webPage.create();
page.viewportSize = { width: 1920, height: 1080 };
page.open("-----------", function start(status) {
page.render('test.jpeg', {format: 'jpeg', quality: '100'});
phantom.exit();
});
テストを支援したい人のためのクイックビューコード。
<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/vue/latest/vue.js" charset="utf-8"></script>
<style media="screen"> body { background-color: grey; } </style>
</head>
<body>
plain text before vue
<div id="app" v-text="title" />
plain text after vue
<script type="text/javascript">
const app = new Vue({ el : '#app', data() { return { title : 'Vue Title' } } });
</script>
</body>
</html>
試してみたい人には、phantom.jsをインストールしてex:text.jsを作成し、端末に電話をかけてください。 phantomjs test.js – marceloch2
私はvuejsとwkhtmltopdfにも問題があります。 – Nick
@ニックあなたは、サーバー側のレンダリングに変更すると、あなたのvueがpdf生成で正常に動作すると思います。私の場合、私はssrのために今変更することはできません。 可能であれば、私はあなたのpdfが動作することをほとんど確信しています。 – marceloch2