chanind / hanzi-writer

Chinese character stroke order animations and practice quizzes
https://hanziwriter.org
MIT License
3.47k stars 539 forks source link

Don't work with VUE #228

Closed suizonghe closed 3 years ago

suizonghe commented 3 years ago

Vue:2.9.6 Node:13.14.0 hanzi-writer:3.1.0

I already have tried many ways, but it just doesn't work, so weird.

when i import local js file: import '../assets/js/hanzi-writer.min.js' it's warning: ReferenceError: HanziWriter is not defined

when i use npm install hanzi-writer cnpm install hanzi-writer

<div  id="character_target"></div>
<script>
const HanziWriter = require('hanzi-writer');
var writer = HanziWriter.create('character_target','你',{
    width: 300,
    height: 300,
    padding: 5
});
</script>

it's warning: TypeError: HanziWriter.create is not a function but i console.log(HanziWriter);, it(HanziWriter) has data

So somebody can help me, i really don't know what to do.....

chanind commented 3 years ago

You could try const HanziWriter = require('hanzi-writer').default;, not sure if it's a import style thing

suizonghe commented 3 years ago

You could try const HanziWriter = require('hanzi-writer').default;, not sure if it's a import style thing

I tried const HanziWriter = require('hanzi-writer').default;, it works! But i also tried again the way i started: After cnpm install hanzi-writer in main.js import hanzi-writer import HanziWriter from 'hanzi-writer' Vue.prototype.$hw = HanziWriter; And use this.$hw in vue file Also works!!! I don't know what to say, it just the same way i used it before, maybe just rebooted the computer, SO WEIRD!

Thanks anyway, it's a lot of help. @chanind