Comments (13)
@albertoforni suggestion helps.
For newer webpack versions, this works for me:
module: {
rules: [
{enforce: 'post', test: /unicode-properties[\/\\]index.js$/, loader: "transform-loader?brfs"},
{enforce: 'post', test: /fontkit[\/\\]index.js$/, loader: "transform-loader?brfs"},
{enforce: 'post', test: /linebreak[\/\\]src[\/\\]linebreaker.js/, loader: "transform-loader?brfs"}
]
}
Are there any plans to implement a solution, that works without these workarounds?
from fontkit.
Try fontkit-next package. It has this PR applied and should work
from fontkit.
I got it working by installing transform-loader
-> npm i transform-loader --save-dev
and then in the webpack.config.js
module: {
loaders: [
...loaders,
{enforce: 'post', test: /fontkit[\/\\]index.js$/, loader: "transform?brfs"},
{enforce: 'post', test: /unicode-properties[\/\\]index.js$/, loader: "transform?brfs"},
{enforce: 'post', test: /linebreak[\/\\]src[\/\\]linebreaker.js/, loader: "transform?brfs"}
]
},
I hope this helps.
from fontkit.
The following worked for me:
const nodeExternals = require('webpack-node-externals');
config = {
...
target: 'node',
externals: [nodeExternals()],
...
};
As described by webpack-node-externals:
When bundling with Webpack for the backend - you usually don't want to bundle its node_modules dependencies
That library is helpful to handle all node_modules
, but you can also just specify fontkit
in externals
config.externals = {
'fontkit-next': 'commonjs fontkit-next',
};
from fontkit.
I have the same issue any help
from fontkit.
Is there a trace available that explains where that error is thrown?
from fontkit.
In pdfmake we using brfs transformation ( see https://github.com/bpampuch/pdfmake/blob/33df9bbec76b358bec8d08bc49a1d2892445a3fa/webpack.config.js#L63 ). And then no external files are required.
from fontkit.
@Pomax Here's a stack trace:
dave@DMR-SURFACEPRO3:/mnt/c/Users/dave/Code/font-server$ node app/dist/bundle.js
fs.js:584
return binding.open(pathModule._makeLong(path), stringToFlags(flags), mode);
^
Error: ENOENT: no such file or directory, open '//data.trie'
at Object.fs.openSync (fs.js:584:18)
at Object.fs.readFileSync (fs.js:491:33)
at Object.<anonymous> (/mnt/c/Users/dave/Code/font-server/app/dist/bundle.js:41204:27)
at Object.module.exports.categories (/mnt/c/Users/dave/Code/font-server/app/dist/bundle.js:41338:30)
at __webpack_require__ (/mnt/c/Users/dave/Code/font-server/app/dist/bundle.js:20:30)
at Object.<anonymous> (/mnt/c/Users/dave/Code/font-server/app/dist/bundle.js:21372:31)
at Object.<anonymous> (/mnt/c/Users/dave/Code/font-server/app/dist/bundle.js:36269:30)
at __webpack_require__ (/mnt/c/Users/dave/Code/font-server/app/dist/bundle.js:20:30)
at Object.<anonymous> (/mnt/c/Users/dave/Code/font-server/app/dist/bundle.js:9158:17)
at __webpack_require__ (/mnt/c/Users/dave/Code/font-server/app/dist/bundle.js:20:30)
from fontkit.
Hello, I got fs is undefined when using transform-loader?brfs in fontkit. How do you guys resolve this issue?
from fontkit.
Looking at https://github.com/webpack-contrib/transform-loader#webpack-2-config-example, it feels like the confs shown so far are not quite in line with how brfs
should be used with webpack. It might be worth replicating the code as shown in the transform-loader README.md and seeing if that solves the problem.
from fontkit.
I don't really want to mess with my config just to get this to work in the browser, this should work out of the box :(
I had no idea how to modify the webpack config via chainWebpack (I'm trying to use fontkit in a Vue app that uses Vue-CLI), but the below seems to work β it eliminates the fs.readFileSync is not a function
error upon importing fontkit.
The error still occurs when trying to call fontkit.open()
or fontkit.openSync()
but no error is raised when using fontkit.create()
instead.
module.exports = {
chainWebpack: config => {
config.module
.rule('eslint')
.use('eslint-loader')
.tap(opts => ({ ...opts, emitWarning: true }));
config.module
.rule('fontkit')
.test(/fontkit[\/\\]index.js$/)
.use('transform-loader')
.loader("transform-loader?brfs")
config.module
.rule('unicode-properties')
.test(/unicode-properties[\/\\]index.js$/)
.use('transform-loader')
.loader("transform-loader?brfs")
config.module
.rule('linebreak')
.test(/linebreak[\/\\]src[\/\\]linebreaker.js/)
.use('transform-loader')
.loader("transform-loader?brfs")
// The above trying to replicate this:
// {enforce: 'post', test: /fontkit[\/\\]index.js$/, loader: "transform?brfs"},
// {enforce: 'post', test: /unicode-properties[\/\\]index.js$/, loader: "transform?brfs"},
// {enforce: 'post', test: /linebreak[\/\\]src[\/\\]linebreaker.js/, loader: "transform?brfs"}
}
}
And then
async openFromFile(file) {
const arrayBuffer = await file.arrayBuffer();
const f = fontkit.create(new Buffer(arrayBuffer));
}
from fontkit.
I don't think this is an adequate solution. transform-loader
has not been updated for 4 years and doesn't purport to support greater than webpack 2.x. I am using webpack 5.x and would love to be able to handle this module with asset modules at the most and no crazy work-arounds. It would be really nice if fontkit handled importing these .trie
files using standard import or require statements instead of reading directly off the filesystem so webpack can pick it up. Bundling a module is not an unusual requirement. Is there any reason why it can't do this? I will take a look when I have some time to investigate
from fontkit.
at the very least, I'd say "see if it works with esbuild instead" given the monster that webpack is these days, and given how much faster (and arguably better) esbuild is.
That said, the way fontkit works it's entirely likely that still won't get you to something that works without running the .trie data build yourself as an explicit step in your build.
from fontkit.
Related Issues (20)
- TypeError when encoding subset of font with set variation
- Modify and save/write a font HOT 1
- font.layout crashing on esoteric unicode character
- Implementation question: availableFeatures HOT 1
- Support glyph path fill rule (non-zero winding / even-odd crossing / etc)
- Handle avar table version 2
- Exntend font.layout accept Array of Glyphs and return a GlyphRun? HOT 1
- .getImageForSize(100) returns "null" using "Apple Color Emoji.ttc" HOT 2
- when i use fontkit to genetate the subset of ttf file,but can not open the subset file,shows βnot a valid font fileβ HOT 3
- [Performance] WOFF font format for CJK languages is 5x slower in Chrome and Unresponsive in Firefox HOT 1
- seac-like endchar compatibility syntax not handled HOT 1
- Cannot use Fontkit on CodeSandbox.io HOT 3
- How to extract individual TTF from a font collection (TTC) file?
- Missing initialisation for pts variable for glyphs HOT 1
- Trouble with Kerning / Letter Spacing HOT 1
- fontkit library installing on react js project while importing we have issue
- fonkit 2.0.0 create from ArrayBuffer returns empty `variationAxes` and null parameters HOT 1
- Newest version of restructure doesn't support all string encodings HOT 6
- Empty _table object
- Fontkit.Font to Buffer
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from fontkit.