diff --git a/lint-staged.config.js b/lint-staged.config.js index 5bea863be5cf..22ca8c95bd1d 100644 --- a/lint-staged.config.js +++ b/lint-staged.config.js @@ -14,7 +14,7 @@ module.exports = { `git add ${escapedFileNames}`, ] }, - '**/*.{json,md,mdx,css,html,yml,yaml,scss,sass}': filenames => { + '**/*.{json,md,mdx,css,html,yml,yaml,scss}': filenames => { const escapedFileNames = filenames .map(filename => `"${isWin ? filename : escape([filename])}"`) .join(' ') diff --git a/package.json b/package.json index c1866b0dc694..18a274008231 100644 --- a/package.json +++ b/package.json @@ -23,8 +23,8 @@ "lint-eslint": "eslint . --ext js,jsx,ts,tsx --max-warnings=0", "lint": "run-p lint-typescript prettier-check lint-eslint", "lint-fix": "yarn prettier-fix && eslint . --ext js,jsx,ts,tsx --fix --max-warnings=0", - "prettier-check": "prettier --check \"**/*.{js,jsx,json,ts,tsx,md,mdx,css,html,yml,yaml,scss,sass}\"", - "prettier-fix": "prettier --write \"**/*.{js,jsx,json,ts,tsx,md,mdx,css,html,yml,yaml,scss,sass}\"", + "prettier-check": "prettier --check \"**/*.{js,jsx,json,ts,tsx,md,mdx,css,html,yml,yaml,scss}\"", + "prettier-fix": "prettier --write \"**/*.{js,jsx,json,ts,tsx,md,mdx,css,html,yml,yaml,scss}\"", "types": "lerna run types --stream", "typescript": "lerna run typescript", "prepublish": "lerna run prepublish", diff --git a/packages/next/types/global.d.ts b/packages/next/types/global.d.ts index 533398d22c95..706b8a1dbd18 100644 --- a/packages/next/types/global.d.ts +++ b/packages/next/types/global.d.ts @@ -15,3 +15,13 @@ declare module '*.module.css' { const classes: { readonly [key: string]: string } export default classes } + +declare module '*.module.sass' { + const classes: { readonly [key: string]: string } + export default classes +} + +declare module '*.module.scss' { + const classes: { readonly [key: string]: string } + export default classes +} diff --git a/test/integration/typescript/components/hello.module.sass b/test/integration/typescript/components/hello.module.sass new file mode 100644 index 000000000000..73ae7d767261 --- /dev/null +++ b/test/integration/typescript/components/hello.module.sass @@ -0,0 +1,2 @@ +.hello + content: 'hello' diff --git a/test/integration/typescript/components/hello.module.scss b/test/integration/typescript/components/hello.module.scss new file mode 100644 index 000000000000..677d77ed34a6 --- /dev/null +++ b/test/integration/typescript/components/hello.module.scss @@ -0,0 +1,3 @@ +.hello { + content: 'hello'; +} diff --git a/test/integration/typescript/components/hello.ts b/test/integration/typescript/components/hello.ts index e4c1ace030fc..9b7c088a580a 100644 --- a/test/integration/typescript/components/hello.ts +++ b/test/integration/typescript/components/hello.ts @@ -1,6 +1,10 @@ import helloStyles from './hello.module.css' +import helloStyles2 from './hello.module.scss' +import helloStyles3 from './hello.module.sass' export function hello(): string { console.log(helloStyles.hello) + console.log(helloStyles2.hello) + console.log(helloStyles3.hello) return 'Hello' } diff --git a/test/integration/typescript/next.config.js b/test/integration/typescript/next.config.js index d08545263978..5adba078e31d 100644 --- a/test/integration/typescript/next.config.js +++ b/test/integration/typescript/next.config.js @@ -3,5 +3,5 @@ module.exports = { // Make sure entries are not getting disposed. maxInactiveAge: 1000 * 60 * 60, }, - experimental: { css: true }, + experimental: { scss: true }, }