font file 404 - Githubissues

arnog / mathlive

A web component for easy math input

https://cortexjs.io/mathlive

MIT License

1.55k stars 276 forks source link

font file 404 #901

Closed aoxiangsky closed 3 years ago

aoxiangsky commented 3 years ago

Description

[Description of the bug or feature.]

when import npm package , font file net::ERR_ABORTED 404 (Not Found) in development, in vue single page application

for example, as follow:

GET http://localhost:5168/js/fonts/KaTeX_Main-Regular.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Main-BoldItalic.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Main-Bold.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Main-Italic.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Math-Italic.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Math-BoldItalic.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_AMS-Regular.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Caligraphic-Regular.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Caligraphic-Bold.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Fraktur-Regular.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Fraktur-Bold.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_SansSerif-Regular.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_SansSerif-Bold.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_SansSerif-Italic.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Script-Regular.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Typewriter-Regular.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Size1-Regular.woff2 net::ERR_ABORTED 404 (Not Found)

[Include screenshots, screen recordings, code fragments or CodePen if applicable]

Steps to Reproduce

[Provide steps that are specific and repeatable, if possible]

create vue project with vue-cli
import { MathLive, makeMathField } from 'mathlive', and render dom
appear

Actual Behavior

[What happens when you follow the steps above]

GET http://localhost:5168/js/fonts/KaTeX_Main-Regular.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Main-BoldItalic.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Main-Bold.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Main-Italic.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Math-Italic.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Math-BoldItalic.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_AMS-Regular.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Caligraphic-Regular.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Caligraphic-Bold.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Fraktur-Regular.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Fraktur-Bold.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_SansSerif-Regular.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_SansSerif-Bold.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_SansSerif-Italic.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Script-Regular.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Typewriter-Regular.woff2 net::ERR_ABORTED 404 (Not Found) test:1 GET http://localhost:5168/js/fonts/KaTeX_Size1-Regular.woff2 net::ERR_ABORTED 404 (Not Found)

[If there are any error messages, include the exact text shown, or upload a screenshot. Some error messages may be displayed in the Javascript console.]

Expected Behavior

[What did you expect to happen insteead]

[Is this a regression: did it use to work in a previous version?]

Environment

Operating System [Windows]

Browser [Safari, Chrome, IE, Firefox, etc...]

arnog commented 3 years ago

The directory containing the fonts must be placed in your js/ directory. I suppose this is also where you have the mathlive.min.mjs file?

aoxiangsky commented 3 years ago

The directory containing the fonts must be placed in your js/ directory. I suppose this is also where you have the mathlive.min.mjs file?

arnog commented 3 years ago

There appears to be a configuration problem.

According to the error message the mathlive.min.js file is located in a js folder at the root of your site directory. This is where the fonts directory is expected to be. I suspect that your build system/bundler is copying the mathlive.min.mjs file from the dist directory to the js directory.

There are two ways you can address this:

add steps in your build system to copy the fonts directory from the dist directory to the js directory OR
copy the fonts directory from the dist directory to some other convenient location, and use the fontsDirectory option to indicate to MathLive where it is.

You can read more about configuring MathLive with build systems:

arnog commented 3 years ago

No activity in 19 days. Closing. Please reopen if you still have some questions.