Soya Next
  • Introduction
  • Packages
    • soya-next
    • soya-next-cli
    • soya-next-scripts
    • soya-next-server
  • Getting Started
    • Setup
    • Directory Structure
    • Creating an App
    • Build the App for Production
  • User Guide
    • Analyzing Dependencies
    • Configure Redux Store
    • Custom Babel Configuration
    • Custom Document
    • Custom Marlint Configuration
    • Custom Routing
    • Typescript Configuration
    • Universal Environment Configuration
  • Migration Guide
    • 0.4.x to 0.5.x
  • API Reference
    • applyReducers([reducers])
    • createPage([...connectArgs])(Page, [reducers])
    • createRouter(app, [options])
    • withLocale
    • LocaleLink
  • Examples
    • Apollo
    • Authentication
    • CSS Modules
    • CSS Modules with SCSS
    • Custom Routes
    • Internationalization
    • Internationalization with Redux
    • Redirection
    • TodoMVC
  • License
Powered by GitBook
On this page
  • Usage
  • How It Works
  1. Examples

CSS Modules with SCSS

Usage

Clone this repository:

git clone https://github.com/traveloka/soya-next.git
cd soya-next/examples/css-modules-with-scss

Then, install and run it:

npm install
npm start

Open http://localhost:3000 in your browser.

How It Works

This example uses @zeit/next-sass to support CSS Modules.

By default all of your SASS and SCSS files are scoped globally. To make them scoped locally (CSS Modules), you need to suffix them with .mod.sass, .module.sass, .mod.scss or .module.scss.

PreviousCSS ModulesNextCustom Routes

Last updated 6 years ago