Update to Eleventy 12, webpack 5 and Tailwind CSS 2

This commit is contained in:
Rémi Weng 2021-05-26 22:09:08 +02:00
parent 6217f36f9d
commit 4c3dc4108d
5 changed files with 19062 additions and 7770 deletions

26698
package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -20,35 +20,34 @@
},
"license": "ISC",
"devDependencies": {
"@11ty/eleventy": "^0.11.0",
"@11ty/eleventy-plugin-syntaxhighlight": "^3.0.1",
"autoprefixer": "^9.8.6",
"copy-webpack-plugin": "^6.0.3",
"cross-env": "^7.0.2",
"css-loader": "^4.2.1",
"cssnano": "^4.1.10",
"date-fns": "^2.15.0",
"eleventy-plugin-lazyimages": "^2.0.1",
"eslint": "^7.10.0",
"eslint-config-airbnb-base": "^14.2.0",
"eslint-plugin-import": "^2.22.1",
"file-loader": "^6.0.0",
"glob": "^7.1.6",
"@11ty/eleventy": "^0.12.1",
"@11ty/eleventy-plugin-syntaxhighlight": "^3.1.1",
"autoprefixer": "^10.2.6",
"copy-webpack-plugin": "^9.0.0",
"cross-env": "^7.0.3",
"css-loader": "^5.2.6",
"cssnano": "^5.0.4",
"date-fns": "^2.21.3",
"eleventy-plugin-lazyimages": "^2.1.0",
"eslint": "^7.27.0",
"eslint-config-airbnb-base": "^14.2.1",
"eslint-plugin-import": "^2.23.3",
"file-loader": "^6.2.0",
"glob": "^7.1.7",
"html-minifier": "^4.0.0",
"html-webpack-plugin": "^4.3.0",
"husky": "^4.2.5",
"image-webpack-loader": "^6.0.0",
"lint-staged": "^10.2.11",
"mini-css-extract-plugin": "^0.9.0",
"html-webpack-plugin": "^5.3.1",
"husky": "^4.3.8",
"image-webpack-loader": "^7.0.1",
"lint-staged": "^11.0.0",
"mini-css-extract-plugin": "^1.6.0",
"npm-run-all": "^4.1.5",
"postcss-loader": "^3.0.0",
"prettier": "^2.1.2",
"postcss-loader": "^5.3.0",
"prettier": "^2.3.0",
"rimraf": "^3.0.2",
"serve": "^11.3.2",
"tailwindcss": "^1.6.2",
"webpack": "^4.44.1",
"webpack-cli": "^3.3.12",
"webpack-fix-style-only-entries": "^0.5.1"
"tailwindcss": "^2.1.2",
"webpack": "^5.37.1",
"webpack-cli": "^4.7.0"
},
"husky": {
"hooks": {

View file

@ -73,7 +73,7 @@ a:hover {
}
.content table {
@apply whitespace-no-wrap my-8 border-collapse block overflow-auto;
@apply whitespace-nowrap my-8 border-collapse block overflow-auto;
}
.content th,

View file

@ -1,7 +1,44 @@
module.exports = {
purge: ['./src/**/*.ejs', './src/**/*.md'],
theme: {
extend: {},
fontSize: {
xs: '0.75rem',
sm: '0.875rem',
base: '1rem',
lg: '1.125rem',
xl: '1.25rem',
'2xl': '1.5rem',
'3xl': '1.875rem',
'4xl': '2.25rem',
'5xl': '3rem',
'6xl': '4rem',
},
extend: {
colors: {
blue: {
100: '#ebf8ff',
200: '#bee3f8',
300: '#90cdf4',
400: '#63b3ed',
500: '#4299e1',
600: '#3182ce',
700: '#2b6cb0',
800: '#2c5282',
900: '#2a4365',
},
gray: {
100: '#f7fafc',
200: '#edf2f7',
300: '#e2e8f0',
400: '#cbd5e0',
500: '#a0aec0',
600: '#718096',
700: '#4a5568',
800: '#2d3748',
900: '#1a202c',
},
},
},
},
variants: {},
plugins: [],

View file

@ -1,10 +1,8 @@
const glob = require('glob');
const path = require('path');
const webpack = require('webpack');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const FixStyleOnlyEntriesPlugin = require('webpack-fix-style-only-entries');
const entries = glob.sync(path.resolve(__dirname, 'src/assets/images/posts/*.{png,gif,jpg,jpeg}'));
entries.push(path.resolve(__dirname, 'src/assets/styles/main.css'));
@ -29,10 +27,6 @@ module.exports = {
new CopyWebpackPlugin({
patterns: [{ from: path.resolve(__dirname, 'public'), to: path.resolve(__dirname, '_site') }],
}),
new webpack.HashedModuleIdsPlugin(),
new FixStyleOnlyEntriesPlugin({
extensions: ['less', 'scss', 'css', 'styl', 'sass', 'png', 'gif', 'jpg', 'jpeg'], // Empty js should also not be generated with image
}),
new MiniCssExtractPlugin({
filename: cssFileName,
}),