fix(v2): fix plugin-ideal-image breaking website (exports not defined) (#2074)

* fix(v2): fix plugin-ideal-image breaking website (exports not defined)

* nits

* add npm ignore

* lint

.eslintignore

@@ -18,3 +18,4 @@ packages/docusaurus-plugin-content-docs/lib/
 packages/docusaurus-plugin-content-pages/lib/
 packages/docusaurus-plugin-sitemap/lib/
 packages/docusaurus-plugin-ideal-image/lib/
+packages/docusaurus-plugin-ideal-image/copyUntypedFiles.js

packages/docusaurus-plugin-ideal-image/.npmignore

@@ -0,0 +1,2 @@
+src
+copyUntypedFiles.js

packages/docusaurus-plugin-ideal-image/@types/react-ideal-image.d.ts

@@ -1,28 +0,0 @@
-/**
- * Copyright (c) 2017-present, Facebook, Inc.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-declare module '@endiliey/react-ideal-image' {
-  interface SrcType {
-    width: number;
-    src?: string;
-    size?: number;
-    format?: 'webp' | 'jpeg';
-  }
-
-  export interface IdealImageProps {
-    alt?: string;
-    className?: string;
-    height: number;
-    width: number;
-    placeholder: {color: string} | {lqip: string};
-    src: string;
-    srcSet: SrcType[];
-  }
-
-  const IdealImage: React.ComponentType<IdealImageProps>;
-  export default IdealImage;
-}

packages/docusaurus-plugin-ideal-image/copyUntypedFiles.js

@@ -0,0 +1,19 @@
+/**
+ * Copyright (c) 2017-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+const path = require('path');
+const fs = require('fs-extra');
+
+/**
+ * Copy all untyped and static assets files to lib.
+ */
+const srcDir = path.resolve(__dirname, 'src');
+const libDir = path.resolve(__dirname, 'lib');
+fs.copySync(srcDir, libDir, {
+  filter(filepath) {
+    return !/__tests__/.test(filepath) && !/\.ts$/.test(filepath);
+  },
+});

packages/docusaurus-plugin-ideal-image/package.json

@@ -4,14 +4,15 @@
   "description": "Docusaurus Plugin to generate an almost ideal image (responsive, lazy-loading, and low quality placeholder)",
   "main": "lib/index.js",
   "scripts": {
-    "tsc": "tsc"
+    "tsc": "tsc && node copyUntypedFiles.js"
   },
   "publishConfig": {
     "access": "public"
   },
   "license": "MIT",
   "devDependencies": {
-    "@docusaurus/types": "^2.0.0-alpha.37"
+    "@docusaurus/types": "^2.0.0-alpha.37",
+    "fs-extra": "^8.1.0"
   },
   "dependencies": {
     "@endiliey/lqip-loader": "^3.0.2",

packages/docusaurus-plugin-ideal-image/src/index.ts

@@ -10,7 +10,7 @@ import {Configuration} from 'webpack';
 
 import path from 'path';
 
-export = function(_context: LoadContext, options: PluginOptions) {
+export default function(_context: LoadContext, options: PluginOptions) {
   const isProd = process.env.NODE_ENV === 'production';
   return {
     name: 'docusaurus-plugin-ideal-image',
@@ -47,4 +47,4 @@ export = function(_context: LoadContext, options: PluginOptions) {
       };
     },
   };
-};
+}

packages/docusaurus-plugin-ideal-image/src/theme/IdealImage.js

@@ -4,12 +4,10 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-
 import React from 'react';
-import {ImageProps} from '../types';
 import IdealImage from '@endiliey/react-ideal-image';
 
-const Image: React.FC<ImageProps> = props => {
+function Image(props) {
   const {alt, className, img} = props;
   return (
     <IdealImage
@@ -20,12 +18,12 @@ const Image: React.FC<ImageProps> = props => {
       width={img.src.width || 100}
       placeholder={{lqip: img.preSrc}}
       src={img.src.src}
-      srcSet={img.src.images.map((image: any) => ({
+      srcSet={img.src.images.map(image => ({
         ...image,
         src: image.path,
       }))}
     />
   );
-};
+}
 
 export default Image;

packages/docusaurus-plugin-ideal-image/src/types.ts

@@ -35,7 +35,3 @@ export interface PluginOptions {
    */
   quality?: number;
 }
-
-export interface ImageProps extends React.ImgHTMLAttributes<{}> {
-  img: any;
-}

packages/docusaurus-plugin-ideal-image/tsconfig.json

@@ -5,7 +5,5 @@
     "tsBuildInfoFile": "./lib/.tsbuildinfo",
     "rootDir": "src",
     "outDir": "lib",
-    "jsx": "react",
-    "typeRoots": ["@types"],
   }
 }