Git Product home page Git Product logo

ionic-app-generators's Introduction

ionic-app-generators

This project is a small library used for generating content types (page, component, directive, tabs, etc) within an Ionic project. This utility is included as a dependency to ionic-cli.

The project is written in typescript. It is then converted to ES5, and bundled with WebPack to result in a dependency free experience.

To Build

Run npm run build to build the project. It builds an index.js and a package.json file to dist/ionic-generators.

To Publish

Manually increment the package.json version in the build directory. Do a build, and then navigate to the dist/ionic-generators directory and run npm publish.

Before publishing, please run the tests and make sure they pass.

To Test

Unit tests - npm run test E2E - npm run e2e E2E for tabs - npm run e2e

ionic-app-generators's People

Contributors

danbucholtz avatar jthoms1 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

ionic-app-generators's Issues

CLI Generate Function Is Case Sensistive

From @saniyusuf on February 25, 2017 17:0

So I tried to run ionic g page myPageComponent it works just as it should.

However, I tried to run the same command this way ionic g Page myPageComponent and the CLI got very confused. The difference was that the P was uppercase. Can anyone please refer me to the place in the CLI where the params are gotten so I can just call a sanitization method that sanitizes params to lowercase to fix this?

Copied from original issue: ionic-team/ionic-cli#1946

Generate files according to Angular style guide

Hi, I'm fairly new to Ionic and while I was trying the Ionic CLI I've noticed that the generator doesn't create the names of the files by following the Angular style guide.

See STYLE 02-01 and STYLE02-02.

For instance, if I do ionic g component box, this will generate several files named like this:

  • box.html
  • box.scss
  • box.ts

Ideally, it should create something like this:

  • box.component.html
  • box.component.scss
  • box.component.ts

The same pattern will follow when generating pipes, directives or services.

Maybe this behavior is something you deliberately chosed and I'm missing the point. If that's the case, please excuse my boldness. ๐Ÿ˜‰

ionic generate --list reports undefined multiple times

From @jgw96 on February 23, 2017 21:42

From @cfjedimaster on February 22, 2017 22:48

Ionic version: (check one with "x")
[ ] 1.x
[ x] 2.x

I'm submitting a ... (check one with "x")
[ x] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior:
When I type ionic generate --list, I get:

image

Expected behavior:

I'd expect not to see "undefined" multiple times.

Steps to reproduce:

Run ionic generate --list

Related code:

insert any relevant code here

Other information:

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

Your system information:

 ordova CLI: 6.3.1
Ionic Framework Version: 2.0.1
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.1.0
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 10
Node Version: v6.5.0
Xcode version: Not installed

By the way, notice "Cordova" is clipped off.

Copied from original issue: ionic-team/ionic-framework#10535

Copied from original issue: ionic-team/ionic-cli#1940

Wrong link to angular.io in scarfolder of Directive

From @mburger81 on March 8, 2017 9:41

What version of the CLI are you using? Output of ionic --version

2.2.1

Short description of the problem:

I create a directive running ionic g directive draggable and see this in the created directive

/*
  Generated class for the Draggable directive.

  See https://angular.io/docs/ts/latest/api/core/index/DirectiveMetadata-class.html
  for more info on Angular 2 Directives.
*/

The link for the DirectiveMetadata is not the right one :)

What behavior are you expecting?

Perhapse this could be the right link?
https://angular.io/docs/ts/latest/guide/attribute-directives.html

Copied from original issue: ionic-team/ionic-cli#1961

Generated files name doesn't match the class name

Let's say you want to run ionic generate page myPage (or my-page or MyPage, same issue)

You will find a new sub folder my with all my.* files
my

I would've expected something like my-page

Plus, the content is pretty strange to me
In my.ts

@Component({
    selector: 'page-my',
    templateUrl: 'my.html',
})

export class MyPage { ... }

page-myinstead of my-page, why is the selector reversed?
Class name is OK though.

info

ionic g page command is not registering the page component in app.module.ts file

From @faraazc on November 28, 2016 8:58

Short description of the problem:

ionic g page command is not registering the page component in app.module.ts file. Ideally it should include and register the component in the declarations array.
Angular-cli does registers components when scaffold.

What behavior are you expecting?

i would expect ionic cli to register page component in the declarations array of @NgModule decorator and also in entry points array if possible in the file app.module.ts

Steps to reproduce:

  1. run below command
    ionic generate page page_name
    and check the behaviour in app.module.ts

Post the output of ionic info below please

Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.12
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.45
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 7
Node Version: v7.1.0
Xcode version: Not installed

Copied from original issue: ionic-team/ionic-cli#1728

Missing "Page" suffix when generating tabs

When generating tabs:
On the main tabs page the sub tabs pages are imported from the correct files, but in the component class names the "Page" suffix is missing - both in the input statement and on the assigned variables.

I hope I can fix it myself in the next couple of days. Please be patient and tell me, if I am doing something terribly wrong. It is hopefully going to be my first contribution to an open source project :)

ionic 2 generator filenames don't follow naming conventions

From @jaufgang on March 9, 2017 19:33

When you create a component, page, service, etc with the cli generator, the filenames of the TypeScript files do not follow the naming conventions recommended in the official Angular Style Guide, in particular Style 02-02 and Style 02-03. The files are missing the conventional suffix for the file type.

This may not be a crucial or pressing issue, but for the sake of promoting best practices, I think it would be a good idea for the generator to conform to these standard conventions.

Copied from original issue: ionic-team/ionic-cli#1968

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.