Skip to content

feat: tailwindcss perf #22

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
moacode merged 6 commits into from
Nov 19, 2020
Merged

feat: tailwindcss perf #22

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
56f70e7
feat(package.json): upgrade min package versions
Nov 17, 2020
32e1221
chore(app.js): prettier formatting
Nov 17, 2020
2448efc
feat(tailwindcss): modularised tailwind imports
Nov 17, 2020
82137f2
chore(app.js): remove unneeded eslint hints
Nov 17, 2020
9b7b194
Merge branch 'master' into feat/tailwindcss-perf
Nov 19, 2020
eb61ec2
feat(styles): add base css structure
Nov 19, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 9 additions & 9 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,23 +45,23 @@
"core-js": "3.6.5",
"js-event-bus": "^1.0.3",
"regenerator-runtime": "^0.13.7",
"tailwindcss": "^1.9.4",
"tailwindcss": "^1.9.6",
"vue": "^2.6.12"
},
"devDependencies": {
"@babel/core": "^7.12.3",
"@babel/plugin-transform-modules-commonjs": "^7.12.1",
"@babel/preset-env": "^7.12.1",
"@batch/craft-webpack": "^1.3.0",
"@batch/craft-webpack": "^1.4.3",
"@jest/globals": "^26.5.0",
"@testing-library/dom": "^7.26.0",
"@testing-library/jest-dom": "^5.11.4",
"@testing-library/user-event": "^12.1.8",
"@testing-library/vue": "^5.1.0",
"@testing-library/dom": "^7.26.6",
"@testing-library/jest-dom": "^5.11.6",
"@testing-library/user-event": "^12.2.2",
"@testing-library/vue": "^5.3.1",
"babel-core": "^7.0.0-bridge.0",
"babel-jest": "^26.5.2",
"babel-jest": "^26.6.3",
"eslint-import-resolver-webpack": "^0.13.0",
"jest": "^26.5.3",
"jest": "^26.6.3",
"prettier": "^2.1.2",
"vue-jest": "^3.0.7"
},
Expand All @@ -71,4 +71,4 @@
"url": "https://github.com/batchnz/craft-starter/issues"
},
"homepage": "https://github.com/batchnz/craft-starter#readme"
}
}
13 changes: 13 additions & 0 deletions src/css/app-base.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
/**
* This injects Tailwind's base styles, which is a combination of
* Normalize.css and some additional base styles.
*/
@import "tailwindcss/base";

/**
* Here we add custom base styles, applied after the tailwind-base
* classes
*
*/
@import "./base/fonts.css";
@import "./base/variables.css";
14 changes: 14 additions & 0 deletions src/css/app-components.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
/**
* This injects any component classes registered by plugins.
*
*/
@import "tailwindcss/components";

/**
* Here we add custom component classes; stuff we want loaded
* *before* the utilities so that the utilities can still
* override them.
*
*/

@import "./components/my-component.css";
12 changes: 12 additions & 0 deletions src/css/app-utilities.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
/**
* This injects all of Tailwind's utility classes, generated based on your
* config file.
*
*/
@import "tailwindcss/utilities";

/**
* Here we add custom utility classes
*
*/
@import "./utilities/my-utility.css";
10 changes: 0 additions & 10 deletions src/css/app.css
View file
Open in desktop

This file was deleted.

0 src/css/fonts.css → src/css/base/fonts.css
View file
Open in desktop
File renamed without changes.
3 changes: 3 additions & 0 deletions src/css/base/variables.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
/**
* Variables
*/
3 changes: 3 additions & 0 deletions src/css/components/my-component.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
/**
* Example component
*/
3 changes: 3 additions & 0 deletions src/css/utilities/my-utility.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
/**
* Example utility
*/
8 changes: 4 additions & 4 deletions src/js/app.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
/* eslint-disable no-unused-vars */
import styles from "../css/app.css";
/* eslint-enable no-unused-vars */
import "#css/app-base.css";
import "#css/app-components.css";
import "#css/app-utilities.css";

const main = async () => {
// Async load dependencies
Expand Down Expand Up @@ -29,7 +29,7 @@ main().then((components) => {
el: "#app",
components: {
HelloWorld: () =>
import(/* webpackChunkName: "HelloWorld" */ "../vue/HelloWorld.vue"),
import(/* webpackChunkName: "HelloWorld" */ "#vue/HelloWorld.vue"),
},
mounted() {
window.app.emit("vue-mounted");
Expand Down