Imgnx-press NPM

imgNXpress

Tailwind CSS "Printing Press" for Static Modules.

Works with 0Scrape (imgnx/open-src-scrape) to create a scraper that can convert a website's CSS to TailwindCSS.

To initialize, just copy the files from the /template directory into a folder with the name of your website or run init.sh or init.bat, passing your websites as an environment (or "PATH") variable (WEBSITE).

Examples:

# MacOS
WEBSITE=mywebsite.com node index.cjs

# Windows PowerShell
$env:WEBSITE="mywebsite.com"
node index.cjs

Tips

Load from a CDN to reduce bundle size

Loading from a CDN:

<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
    <head>
        <script src="https://www.unpkg.com/react@^18.3.0/umd/react.development.js" crossorigin></script>
    </head>
    <body>
        <!-- ... -->
    </body>
</html>

const { default: React, useEffect, useState, useRef } = [`import()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import#description):("react")
import("./data.json", { with: { type: "json" } });

// webpack.config.js
module.exports = {
    ...
    externals: {
        react: "React",
        "react-dom": "ReactDOM"
    }
}

Including static files

You can also just "import" (ie. "Download" ) JS files and put them in the src/ folder to include them.

Resources

* import()

typescript types imgnx

next chalk react yargs formik cssnano webpack @types/qs @types/ws cross-env react-dom ts-loader typescript @babel/core @types/mime @types/node @types/send webpack-cli @types/react @types/retry babel-loader @types/eslint @types/estree @types/sockjs readline-sync @babel/runtime @types/bonjour @types/connect @types/express react-devtools @types/react-dom @types/http-proxy @types/node-forge @types/prop-types @tailwindcss/forms @types/body-parser @types/http-errors @types/json-schema @types/serve-index @webpack-cli/serve postcss-preset-env webpack-dev-server @babel/preset-react @types/eslint-scope @types/range-parser @types/serve-static html-webpack-plugin @types/readline-sync @adobe/react-spectrum @tailwindcss/typography @react-spectrum/provider @spectrum-icons/workflow @tailwindcss/aspect-ratio @types/html-minifier-terser @tailwindcss/container-queries @types/hoist-non-react-statics @types/express-serve-static-core @csstools/postcss-is-pseudo-class @types/connect-history-api-fallback

1.0.0

8 months ago