giuliano1993 / make-js-component Goto Github PK
View Code? Open in Web Editor NEWCreate your js components with ease! Stramilne your development process
License: MIT License
Create your js components with ease! Stramilne your development process
License: MIT License
Following the model used for VUe advanced ( PR #78 ), we can create Advanced for Angular to allow user to "compose" their component with the parts they prefer
We might need some default set for each framework, in order to skip the post framework selections step with a flag.
This issue is about picking the defaults for vue
It would be nice to have some styling option on React component creation, for example:
Some tests should be implemented to check the maintainability and functionality of the package so it doesn't break while growing and being developed.
I mean also to implement github actions the use tests before allowing merging
Currently, when a new component is created in the same directory and with the same name (and extension clearly) as one that already exists, the latter is overwritten without any kind of warning.
I think it would be useful to introduce a warning if you are trying to overwrite an already existing component and ask for confirmation whether or not you intend to proceed.
We need a comprehensive an cohese documentation about working directly with flags.
At the moment we have 3 flags
--name <name>
allows to specify the component name
-f <framework>
let you specify one of the available frameworks ( at the moment of writing Vue, React, Angular, Qwik, Svelte and Astro)
--folder <path>
the components subfolder in which add the component. The folder is created if it doesn't exsists
We might need some default set for each framework, in order to skip the post framework selections step with a flag.
This issue is about picking the defaults for React
When starting the process, it now allows to use whatever character in component name. That should be avoided and only letters shall be allowed
No
It would be nice to have some styling option on React component creation, for example:
Using a setup like inquirer can be more friendly than using all the options when defining a component, and easier to remember
When starting the process, it now allows to go on after empty component name. That should be avoided
No
The dash character should be permitted in my opinion
Add template and link spec.ts to test component
Add styleUrls
to template component
Following the model used for VUe advanced ( PR #78 ), we can create Advanced for Qwik to allow user to "compose" their component with the parts they prefer
We might need some default set for each framework, in order to skip the post framework selections step with a flag.
This issue is about picking the defaults for Qwik
The input in wizard.mts have no type and could have string
.
Also the whole const wizard
could have a type return like Promise<Answers>
### Do you want to work on this issue?
Yes
That would be cool, instead of going necessarily trough all the wizard, to be able to give an optional argument after the npx make-js-component
in order to skip the framework selection step and go right into the options
the command would then look like
npx make-js-command [frameworkname]
Readme.md
file could be improved, especially we should describe the options available for each framework
Following the model used for VUe advanced ( PR #78 ), we can create Advanced for React to allow user to "compose" their component with the parts they prefer
Following the model used for VUe advanced ( PR #78 ), we can create Advanced for Svelte to allow user to "compose" their component with the parts they prefer
Nuxt framework uses Vue as its frontend.
The components won't change from a normal vue app, but the components shall be created into the ./components
folder instead of the ./src/components
folder.
Add a question to the Vue installer to ask if the user is working in a vue app or in a nuxt one
We could add a --multiple flag that, if checked, at the end of each component creation asks the user if he wants to exit.
Otherwise the creator command will be launched once again.
Doing the user is able to easily create more components in a row
That would be cool, instead of going necessarily trough all the wizard, to be able to give an optional argument after the npx make-js-component
in order to skip the component name writing step and go right into the next options
the command would then look like
npx make-js-command --name=[componentName]
Add the possibility to create an Astro component
Hi, I have already contributed to the project by implementing the React CSS Module feature.
I am excited about the project and really like it, but to be honest, I found the code to be somewhat procedural and, at times, repetitive and confusing.
For example, there are too many nested if/else statements, or repeated code between JS/TS in React components, and there are no comments in the code.
If you agree, I already have ideas on how to make it more extensible and open to modifications.
I believe this choice will completely influence the architecture of the library, so it would be appropriate to suspend the implementation of new features until the refactoring is done.
I also think that now is the right time, especially since the project is still small and there is no documentation yet.
I can put my ideas into action quickly, but with one condition: I am not very confident with TypeScript, so I would only handle the JavaScript part.
What do you think?
When I try to save the component into a subfolder inside a subfolder, the script gives a not handled exception if the second subfolder doesn't exist
Instead, if I give only a folder that doesn't exist, it creates it without problems
? Give a name to your component test1
? Custom path under the component folder for saving your component test1/test1
? Pick a framework to create the component for React
? Do you want to use Typescript? No
? Do you want to use any CSS framework? No
node:internal/fs/utils:347
throw err;
^
Error: ENOENT: no such file or directory, mkdir 'src\components\test1\test1'
at Module.mkdirSync (node:fs:1396:3)
at file:[...]src/utils/utils.mjs:16:16
at FSReqCallback.readFileAfterClose [as oncomplete] (node:internal/fs/read_file_context:68:3) {
errno: -4058,
syscall: 'mkdir',
code: 'ENOENT',
path: 'src\\components\\test1\\test1'
}
It would be nice to have, as a styling option for react, the possibility use modules styling
Give a name to your component test
Custom path for the component (default: src/components)
Pick a framework to create the component for React
Do you want to use Typescript? No (or Yes)
Do you want to use any CSS framework? Styled Components
Yes
When the component creation is complete, ask the user if they want to create another component.
This would allow to directly run again the command and create more component at once
Writing the documentation on how to add a new framework, so:
We could use a subcommand to implement a custom configurations file to define things such the default components folder or some other default ( like composition or option API for vue or typescript use on each component)
We could use a [-d --default] flag that applies all the defaults for the framework, so that we can fully skip the framework wizard and directly have the component
We might need some default set for each framework, in order to skip the post framework selections step with a flag.
This issue is about picking the defaults for Svelte
At the moment the extension defaults to .vue, since originally that package generated only vue components; should be dynamic, depending on the framework of choice
Add the --folder flag with commander to have the possibility to pass the subfolder we want to create the component in.
Not an expert of angular, so if anyone knows some more characteristics a basic Angular component have you're welcome to take on this issue and work on it! ๐
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.