-
-
Notifications
You must be signed in to change notification settings - Fork 79
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #253 from nvh95/less
Support LESS
- Loading branch information
Showing
47 changed files
with
691 additions
and
47 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -3,6 +3,7 @@ | |
| ## Features | ||
|
|
||
| - Inline `@import` statement | ||
| - Support LESS | ||
|
|
||
| # 0.3.0 | ||
|
|
||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| .less-child-p { | ||
| color: yellow; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,8 @@ | ||
| @min400: ~'(min-width: 400px)'; | ||
| .less-p { | ||
| color: blue; | ||
| @media @min400 { | ||
| font-size: 2rem; | ||
| } | ||
| } | ||
| @import './child'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,24 @@ | ||
| # Logs | ||
| logs | ||
| *.log | ||
| npm-debug.log* | ||
| yarn-debug.log* | ||
| yarn-error.log* | ||
| pnpm-debug.log* | ||
| lerna-debug.log* | ||
|
|
||
| node_modules | ||
| dist | ||
| dist-ssr | ||
| *.local | ||
|
|
||
| # Editor directories and files | ||
| .vscode/* | ||
| !.vscode/extensions.json | ||
| .idea | ||
| .DS_Store | ||
| *.suo | ||
| *.ntvs* | ||
| *.njsproj | ||
| *.sln | ||
| *.sw? |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,16 @@ | ||
| { | ||
| "sourceMaps": true, | ||
|
|
||
| "jsc": { | ||
| "parser": { | ||
| "syntax": "typescript", | ||
| "tsx": true | ||
| }, | ||
|
|
||
| "transform": { | ||
| "react": { | ||
| "runtime": "automatic" | ||
| } | ||
| } | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <link rel="icon" type="image/svg+xml" href="/vite.svg" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <title>Vite + React + TS</title> | ||
| </head> | ||
| <body> | ||
| <div id="root"></div> | ||
| <script type="module" src="/src/main.tsx"></script> | ||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,53 @@ | ||
| /** @type {import('@jest/types').Config.InitialOptions} */ | ||
|
|
||
| module.exports = { | ||
| roots: ['<rootDir>/src'], | ||
| collectCoverageFrom: [ | ||
| 'src/**/*.{js,jsx,ts,tsx}', | ||
| '!src/**/*.d.ts', | ||
| '!src/mocks/**', | ||
| ], | ||
| coveragePathIgnorePatterns: [], | ||
| setupFilesAfterEnv: ['<rootDir>/src/setupTests.ts'], | ||
| testEnvironment: 'jsdom', | ||
| modulePaths: ['<rootDir>/src'], | ||
| transform: { | ||
| '^.+\\.(ts|js|tsx|jsx)$': '@swc/jest', | ||
| '^.+\\.(css|scss|sass)$': 'jest-preview/transforms/css', | ||
| '^(?!.*\\.(js|jsx|mjs|cjs|ts|tsx|css|json)$)': | ||
| 'jest-preview/transforms/file', | ||
| }, | ||
| transformIgnorePatterns: [ | ||
| '[/\\\\]node_modules[/\\\\].+\\.(js|jsx|mjs|cjs|ts|tsx)$', | ||
| ], | ||
| modulePaths: ['<rootDir>/src'], | ||
| moduleNameMapper: { | ||
| '^react-native$': 'react-native-web', | ||
| // Used to dedupe `styled-component` when run `npm link` in development | ||
| '^styled-components$': '<rootDir>/node_modules/styled-components', | ||
| // Support import ~ | ||
| '^~(.*)': '<rootDir>/node_modules/$1', | ||
| }, | ||
| moduleFileExtensions: [ | ||
| // Place tsx and ts to beginning as suggestion from Jest team | ||
| // https://jestjs.io/docs/configuration#modulefileextensions-arraystring | ||
| 'tsx', | ||
| 'ts', | ||
| 'web.js', | ||
| 'js', | ||
| 'web.ts', | ||
| 'web.tsx', | ||
| 'json', | ||
| 'web.jsx', | ||
| 'jsx', | ||
| 'node', | ||
| ], | ||
| watchPlugins: [ | ||
| 'jest-watch-typeahead/filename', | ||
| 'jest-watch-typeahead/testname', | ||
| ], | ||
| resetMocks: true, | ||
| // testEnvironmentOptions: { | ||
| // html: '<html><div id="root"></div></html>', | ||
| // }, | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,38 @@ | ||
| { | ||
| "name": "less", | ||
| "private": true, | ||
| "version": "0.0.0", | ||
| "type": "module", | ||
| "scripts": { | ||
| "dev": "vite", | ||
| "build": "tsc && vite build", | ||
| "preview": "vite preview", | ||
| "jest-preview": "jest-preview", | ||
| "test": "jest --watch", | ||
| "test:ci": "jest", | ||
| "test:nc": "npm run test -- --no-cache", | ||
| "test:debug": "npm-run-all -p test jest-preview" | ||
| }, | ||
| "dependencies": { | ||
| "less": "^4.1.3", | ||
| "react": "^18.2.0", | ||
| "react-dom": "^18.2.0" | ||
| }, | ||
| "devDependencies": { | ||
| "@swc/core": "^1.2.242", | ||
| "@swc/jest": "^0.2.22", | ||
| "@testing-library/dom": "^8.17.1", | ||
| "@testing-library/jest-dom": "^5.16.5", | ||
| "@testing-library/react": "^13.3.0", | ||
| "@testing-library/user-event": "^14.4.3", | ||
| "@types/react": "^18.0.17", | ||
| "@types/react-dom": "^18.0.6", | ||
| "@vitejs/plugin-react": "^2.0.1", | ||
| "jest": "^28.1.3", | ||
| "jest-environment-jsdom": "^28.1.3", | ||
| "jest-preview": "file:../..", | ||
| "jest-watch-typeahead": "^2.0.0", | ||
| "typescript": "^4.6.4", | ||
| "vite": "^3.0.7" | ||
| } | ||
| } |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,41 @@ | ||
| #root { | ||
| max-width: 1280px; | ||
| margin: 0 auto; | ||
| padding: 2rem; | ||
| text-align: center; | ||
| } | ||
|
|
||
| .logo { | ||
| height: 6em; | ||
| padding: 1.5em; | ||
| will-change: filter; | ||
| } | ||
| .logo:hover { | ||
| filter: drop-shadow(0 0 2em #646cffaa); | ||
| } | ||
| .logo.react:hover { | ||
| filter: drop-shadow(0 0 2em #61dafbaa); | ||
| } | ||
|
|
||
| @keyframes logo-spin { | ||
| from { | ||
| transform: rotate(0deg); | ||
| } | ||
| to { | ||
| transform: rotate(360deg); | ||
| } | ||
| } | ||
|
|
||
| @media (prefers-reduced-motion: no-preference) { | ||
| a:nth-of-type(2) .logo { | ||
| animation: logo-spin infinite 20s linear; | ||
| } | ||
| } | ||
|
|
||
| .card { | ||
| padding: 2em; | ||
| } | ||
|
|
||
| .read-the-docs { | ||
| color: #888; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,40 @@ | ||
| import { useState } from 'react'; | ||
| import reactLogo from './assets/react.svg'; | ||
| import './App.css'; | ||
| import './style.less'; | ||
|
|
||
| function App() { | ||
| const [count, setCount] = useState(0); | ||
|
|
||
| return ( | ||
| <div className="App"> | ||
| <div> | ||
| <a href="https://vitejs.dev" target="_blank"> | ||
| <img src="/vite.svg" className="logo" alt="Vite logo" /> | ||
| </a> | ||
| <a href="https://reactjs.org" target="_blank"> | ||
| <img src={reactLogo} className="logo react" alt="React logo" /> | ||
| </a> | ||
| </div> | ||
| <h1>Vite + React</h1> | ||
| <p className="less-p">Less: Blue + Dynamic size (break point 400px)</p> | ||
| <div className="card"> | ||
| <button | ||
| data-testid="increase" | ||
| onClick={() => setCount((count) => count + 1)} | ||
| > | ||
| count is | ||
| <span data-testid="count">{count}</span> | ||
| </button> | ||
| <p> | ||
| Edit <code>src/App.tsx</code> and save to test HMR | ||
| </p> | ||
| </div> | ||
| <p className="read-the-docs"> | ||
| Click on the Vite and React logos to learn more | ||
| </p> | ||
| </div> | ||
| ); | ||
| } | ||
|
|
||
| export default App; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,28 @@ | ||
| import { render, screen } from '@testing-library/react'; | ||
|
|
||
| import userEvent from '@testing-library/user-event'; | ||
| import App from '../App'; | ||
| import preview from 'jest-preview'; | ||
|
|
||
| describe('App', () => { | ||
| it('should work as expected', async () => { | ||
| const root = document.createElement('div'); | ||
| root.id = 'root'; | ||
| render(<App />, { | ||
| container: document.body.appendChild(root), | ||
| }); | ||
| console.log(document.body.outerHTML); | ||
| await userEvent.click(screen.getByTestId('increase')); | ||
| await userEvent.click(screen.getByTestId('increase')); | ||
| await userEvent.click(screen.getByTestId('increase')); | ||
| await userEvent.click(screen.getByTestId('increase')); | ||
| await userEvent.click(screen.getByTestId('increase')); | ||
| await userEvent.click(screen.getByTestId('increase')); | ||
|
|
||
| // Open http://localhost:3336 to see preview | ||
| // Require to run `jest-preview` server before | ||
| preview.debug(); | ||
|
|
||
| expect(screen.getByTestId('count')).toContainHTML('6'); | ||
| }); | ||
| }); |
Oops, something went wrong.