Vue installs animate.css and introduces it in main.js. When running the packaged file dist on the server, an error will be reported.

Animate.css is a very useful animation library. It is very simple to use in vue. Install it first.

npm install animate.css --save

Introduced globally in main.js

import animated from 'animate.css'

Vue.use(animated)

However, when running the dist package after packaging, an error will be reported.

 Reason: Vue.use (plug-in) will trigger the install method in this plug-in file, and animate.css is a css file, and

Vue.use cannot pass in css files

Solution: Comment out Vue.use(animated) in main.js and import 'animate.css/animate.css' directly

import animated from 'animate.css'
//Vue.use(animated)

Or introduce it directly in the html file without installing dependent packages in animated.css

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"/>

You can also save https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css locally

Then introduce it in main.js

Guess you like

Origin blog.csdn.net/to_prototy/article/details/132027964