mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-26 23:52:06 +00:00
9ebbb14eab
- Add README for examples vuex-store, async-data and global-css - Add examples/global-css/ - Feature: we can now use nuxt.config.js to add global css files and modules - Fix: show webpack error of compilation |
||
---|---|---|
.. | ||
css | ||
pages | ||
nuxt.config.js | ||
package.json | ||
README.me |
# Global CSS with Nuxt.js > Nuxt.js let you define the CSS files/modules/libraries you want to set as globals (included in every pages). ## Usage In `nuxt.config.js` file, add the CSS ressources: ```js const { resolve } = require('path') module.exports = { css: [ // Load a node.js module 'hover.css/css/hover-min.css', // node.js module but we specify the lang { src: 'bulma', lang: 'sass' }, // Css file in the project // It is important to give an absolute path resolve(__dirname, 'css/main.css') ] } ``` ## Demo To see the demo working: ```bash npm install npm start ``` Go to [http://localhost:8080](http://localhost:8080) and navigate inside the app. ## Production In production, they will be minified and extracted in a file named `styles.css` and added in the `<head>` of the page. To launch the demo in production mode so you can see the ``<head>` populated with the `<link>` tag: ```bash NODE_ENV=production npm start ``` Go to [http://localhost:8080](http://localhost:8080) and check the source code.