GithubHelp home page GithubHelp logo

Comments (3)

kvedantmahajan avatar kvedantmahajan commented on May 28, 2024 2

@dijs Please do this soon. Traffic is coming from gregberge/svgr#189

+1 for this index.ts naming.

While doing this you may not want to append .tsx or ts in the generated import statements of file i.e.

export { default as Announcement } from './Announcement.tsx';

as it makes tslint unhappy.

from create-index.

kvedantmahajan avatar kvedantmahajan commented on May 28, 2024 2

Here, I have written a tiny nodejs script to achieve the same after create-index generates an index.js ( I have a Typescript project ).
Basically I had to replace .tsx from all import statements in index.js. Second, I had to rename it to index.ts.

const path = require("path");
const fs = require("fs");

const filePath = path.join("src", "icons");
const fileName = "index.js";

fs.readFile(`${filePath}/${fileName}`, "utf8", (err, data) => {
	if (err) throw err;
	const newStr = data.replace(/.tsx/g, "");
	fs.writeFile(`${filePath}/${fileName}`, newStr, writeErr => {
		if (writeErr) throw err;
		fs.rename(`${filePath}/${fileName}`, `${filePath}/index.ts`, renameErr => {
			if (renameErr) throw renameErr;
			console.log("rename completed");
		});
	});
});

package.json scripts as follows:

"build-icons": "rm -rf src/icons && npx @svgr/cli -d src/icons svg-icons --ext tsx",
"create-index": "npx create-index src/icons --extensions tsx",
"recreate-index": "node scripts/regenerate-icon-index.js",
"lint:icons": "eslint './src/icons/*.{ts,tsx}' --fix",
"generate-icons": "yarn run build-icons && yarn run create-index && yarn run recreate-index && yarn run lint:icons"

from create-index.

dijs avatar dijs commented on May 28, 2024

I would also like to change the output directory. I may work on this.

from create-index.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.