1. 程式人生 > >[Nuxt] Add CSS Libraries to Nuxt

[Nuxt] Add CSS Libraries to Nuxt

ble favicon tom viewport exp then initial har ati

You can easily add CSS libraries to Nuxt using yarn or npm to install them, then simply adding them to the nuxt.config.js so they‘re included in each page. Then all the classes will be available for use in all of your templates. This lesson walks your through installing a library then adding it to your nuxt.config.js

.

Install:

npm i --save tachyons

nuxt.config.js:

module.exports = {
  /*
  ** Headers of the page
  */
  head: {
    title: ‘starter‘,
    meta: [
      { charset: ‘utf-8‘ },
      { name: ‘viewport‘, content: ‘width=device-width, initial-scale=1‘ },
      { hid: ‘description‘, name: ‘description‘, content: ‘Nuxt.js project‘ }
    ],
    link: [
      { rel: 
‘icon‘, type: ‘image/x-icon‘, href: ‘/favicon.ico‘ } ] }, /** * Global CSS */ css: [‘tachyons/css/tachyons.css‘], /* ** Customize the progress-bar color */ loading: { color: ‘#3B8070‘ }, /* ** Build configuration */ build: { /* ** Run ESLINT on save */ extend (config, ctx) {
if (ctx.isClient) { config.module.rules.push({ enforce: ‘pre‘, test: /\.(js|vue)$/, loader: ‘eslint-loader‘, exclude: /(node_modules)/ }) } } } }

[Nuxt] Add CSS Libraries to Nuxt