Closed MrJoeXu closed 6 years ago
@MrJoeXu It isn’t really a limitation. The static assets just aren’t copied by default when running build:system
.
I modified that example branch a little and added a little more functionality. See this commit: https://github.com/viljamis/vue-design-system/commit/e7eea29327b54520df8c8eaca26294f52d4159de
With those changes, you can run npm run build:system
and it’ll copy the fonts over as well. Once the build is complete and you’ve NPM installed the new version, you just need to make sure to import the fonts correctly in your projects. So for example importing the fonts in your main.js
:
import system from 'vue-design-system'
import 'vue-design-system/dist/system/system.css';
import 'vue-design-system/dist/system/fonts/fonts.css';
Vue.use(system)
And making sure that your Webpack config has the necessary rules to load font files (you might already have something like this, but if not, Webpack will throw you an error):
{
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
loader: "file-loader",
options: {
limit: 10000,
},
}
@MrJoeXu I’ve release a new version (2.1.4) where the static assets are now copied by default too when building lib. If you already did those changes, no need update though.
I used a custom font locally and load them according to this commit. It works well inside the doc.
But once I did
npm run build:system
and install the design system as a seperate npm module in my main app, the custom font wasn't loaded in any of thedesign-system
's component. Is this a known limitation of the system, or is there some extra steps I have to follow?