optimize images

blog/2020-08-10-my-first-blog.md

@@ -25,4 +25,4 @@ get(object, 'value.1');
 
   * *list 2*
 
-![](/img/512px-eo_circle_lime_letter-t.svg.png "Test image")
+![](/img/beautiful-calla-lily-nice-background-color-70725804.jpg "Test image")

gatsby-config.js

@@ -18,6 +18,13 @@ module.exports = {
 		);
 	},
 	plugins: [
+		{
+			resolve: `gatsby-source-filesystem`,
+			options: {
+				path: `${__dirname}/static/img`,
+				name: `images`,
+			},
+		},
 		`gatsby-plugin-netlify-cms`,
 		{
 			resolve: `gatsby-plugin-mdx`,
@@ -27,13 +34,29 @@ module.exports = {
 					default: require.resolve('./src/templates/PageTemplate.tsx'),
 				},
 				gatsbyRemarkPlugins: [
+					{
+						resolve: `gatsby-remark-relative-images`,
+					},
 					{
 						resolve: `gatsby-remark-images`,
 						options: {
-							maxWidth: 1035,
-							sizeByPixelDensity: true,
+							maxWidth: 896,
+							linkImagesToOriginal: false,
+						},
+					},
+					{
+						resolve: 'gatsby-remark-copy-linked-files',
+						options: {
+							destinationDir: 'static/',
+						},
+					},
+					{
+						resolve: `gatsby-remark-responsive-iframe`,
+						options: {
+							wrapperStyle: `margin-bottom: 1.0725rem`,
 						},
 					},
+					`gatsby-remark-external-links`,
 				],
 			},
 		},
@@ -48,18 +71,6 @@ module.exports = {
 		`gatsby-plugin-postcss`,
 		`gatsby-plugin-emotion`,
 		`gatsby-plugin-react-helmet`,
-		{
-			resolve: 'gatsby-plugin-manifest',
-			options: {
-				name: 'Schönherz Design Stúdió',
-				short_name: 'schdesign',
-				start_url: '/',
-				background_color: '#3d3d3d',
-				theme_color: '#f8485e',
-				display: 'standalone',
-				icon: 'src/images/favicon.ico',
-			},
-		},
 		{
 			resolve: `gatsby-source-filesystem`,
 			options: {

gatsby-node.js

@@ -1,6 +1,6 @@
 const path = require('path');
 const { merge } = require('webpack-merge');
-const { createFilePath } = require('gatsby-source-filesystem');
+const { fmImagesToRelative } = require('gatsby-remark-relative-images');
 
 exports.onCreateWebpackConfig = ({ actions, getConfig }) => {
 	let config = getConfig();
@@ -75,3 +75,7 @@ exports.createPages = async ({ actions, graphql, reporter }) => {
 		});
 	});
 };
+
+exports.onCreateNode = ({ node }) => {
+	fmImagesToRelative(node);
+};