How to have a flipbook like turn.js in Nuxt?-CodePudding

How to can import turn.js to nuxt.js project. When I use through plugin then error Window not define, even though I used it in client mode

Update: I used required package check is client, but I get error jquery__WEBPACK_IMPORTED_MODULE_3___default(...)(...).turn is not a function

<template>
    <div id="flipbook">
        <div class="hard">
            Turn.js
        </div>
        <div class="hard" />
        <div> Page 1 </div>
        <div> Page 2 </div>
        <div> Page 3 </div>
        <div> Page 4 </div>
        <div class="hard" />
        <div class="hard" />
    </div>
</template>

<script>
    import $ from 'jquery';

    if (process.client) {
        require('turn.js');
    }

    export default {
        mounted() {
            console.log($('#flipbook').turn('page'));
            $('#flipbook'.turn({
                width: 400,
                height: 300,
                autoCenter: true,
            }));
        },

    };
</script>

CodePudding user response：

EDIT TLDR: use

Writing your own with a bit of CSS JS is also totally feasible and will provide the best results IMO.