500tech / angular-kick Goto Github PK

Right now we have:

// Fonts and images
{
  test: /\.(ttf|eot|svg|otf|png)$/,
  loader: 'file'
},
{
  test: /\.(png)$/,
  loader: 'url?mimetype=image/png'
},
{
  test: /\.woff(2)?$/,
  loader: 'url?limit=10000&minetype=application/font-woff'
},

I've been using:

// Allow `require`ing image/font files (also when included in CSS)
// Inline assets under 5kb as Base64 data URI, otherwise uses `file-loader`
{
  test: /\.(jpe?g|png|gif|eot|woff2?|ttf|svg)(\?.*)?$/i,
  loaders: [
    'url?limit=5120&name=[path][name].[hash].[ext]'
  ]
}

• 5k is the recommended limit for inlining, based on some article.

Right now Kick removes the dist folder before each run of kick bundle.

I think we should move the responsibility of this task to Webpack.
We should try to minimize the amount of dependency on Kick if it's simple to implement.

Ideally, I could use kick as a boilerplate generator only if I wanted to (that's the most simple entry point for most devs).

var CleanPlugin = require('clean-webpack-plugin');

...

if (appEnv === 'production') {
  config.plugins.push(
    // Remove build related folders
    new CleanPlugin(['dist'])
  );
}

Ref:
https://github.com/johnagan/clean-webpack-plugin

To reproduce:

1. kick new invalidName
2. cd invalid-name
3. kick generate state my-state
4. cat app/config/routes/my-state.js

This generates:
export /* @ngInject */ function my-stateRoutes ($stateProvider) {

my-stateRoutes is an invalid function name

C:\Users\Hans\web\angular\20\nir-kaufman\kick-test\app>dir
Volume in drive C is Windows
Volume Serial Number is AEB8-B189

Directory of C:\Users\Hans\web\angular\20\nir-kaufman\kick-test\app

23.09.2015 08:33

Seems this starter uses Babel 5.x (as well as some other outdated libs such as Angular and Webpack).

Can read about it here:

https://github.com/babel/babel-loader#babel-is-injecting-helpers-into-each-file-and-bloating-my-code

http://www.angular-kick.com/

The NPM link at the top points to: https://www.npmjs.com/package/angular-kick
But the actual link is: https://www.npmjs.com/package/kick

Where do I update ti?

It should instead warn that you are trying to generate an existing file and ask if you would like to continue.
Default option should be no (N)

To reproduce:

1. cat app/partials/_header.html
2. kick generate partial header
3. repeat step 1

also when env.json changes

here is the exception

events.js:85
      throw er; // Unhandled 'error' event
            ^
Error: spawn bower ENOENT
    at exports._errnoException (util.js:746:11)
    at Process.ChildProcess._handle.onexit (child_process.js:1046:32)
    at child_process.js:1137:20
    at process._tickCallback (node.js:355:11)

my workaround was npm install -g bower

kick new [application-name]

/usr/local/lib/node_modules/kick/bin/kick:47
const answer = prompt(${message.didYouMean(intention)} ${message.yesNo})
^
SyntaxError: Unexpected token ILLEGAL
at exports.runInThisContext (vm.js:73:16)
at Module._compile (module.js:443:25)
at Object.Module._extensions..js (module.js:478:10)
at Module.load (module.js:355:32)
at Function.Module._load (module.js:310:12)
at Function.Module.runMain (module.js:501:10)
at startup (node.js:129:16)
at node.js:814:3

I think kick should stick to unix standards, if no command is given then help is displayed.

Thoughts?

In:
https://github.com/500tech/angular-kick/blob/master/templates/angular/app/package.json#L12

I think we should use build instead of bundle.
It's shorter, and used commonly.

Also, we should add a "prebuild": "npm prune; npm install",

When, for example, writing kick s component newComponent, kick should ask:

– Did you mean `kick g component`? [Y/n]

Hello,

I decided to try out kick but it went into an infinite loop on "kick new app". For some reason it never completes.

Br,
Fran

P.S. I found this AvianFlu/ncp#100 and did the swap. The copy completed really fast.

Right now there's a preloader env-replace that goes through all files and replaces @@PROPERTY with the values in environments.json.

Then this file is imported and set as a constant on the app module.

That's ok, but Webpack already has a solution for that exact scenario:

// Define global variables that will be available in any chunk
new webpack.DefinePlugin({
  ENV: process.env.NODE_ENV,
  API_URL: appConfig.API_URL
})

This adds variables that are available in all imported modules (not on window just the global Webpack module).

I used it as is, but it could be used as a constant as well (similar to how it is now in Kick):

  if (ENV === 'production') {
    // Enable for performance boost on production
    $compileProvider.debugInfoEnabled(false);

    // Disable console.log outputs for production
    $logProvider.debugEnabled(false);
  }

The main benefit is that we'd be using something that Webpack already provides and familiar to others.
1 less package to download.
No weird characters.

Currently we can only generate singletons (services)
Need something for function, class and value

When packaging my app I need to copy files to the dist folder

I can only see the bundled test file, not the source files.

Kick runs on port 8080, 2 projects using Kick can't run at the same time.

We should allow a param for setting the port.
And also, maybe find an available port by default.

We could use this:
https://github.com/baalexander/node-portscanner

Also, webpack-dev-server accepts a --port or devServer.port in the config:
https://webpack.github.io/docs/webpack-dev-server.html#webpack-dev-server-cli

Will not replace usages.
Only replace whatever kick generated - name of service/ file names, export / import, references inside spec

Finished in 0.127 secs / 0.088 secs

SUMMARY:
✔ 3 tests completed
Missing error handler on socket.
TypeError: sockets.forEach is not a function
at disconnectBrowsers (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:314:13)
at null. (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:291:7)
at emitTwo (events.js:92:20)
at emit (events.js:172:7)
at emitRunCompleteIfAllBrowsersDone (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:256:12)
at null. (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:278:9)
at emitTwo (events.js:92:20)
at emit (events.js:172:7)
at onComplete (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/browser.js:142:13)
at Socket. (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/events.js:13:22)
at emitTwo (events.js:92:20)
at Socket.emit (events.js:172:7)
at Socket.onevent (/Users/dror/workspace/kick-app/test-app/node_modules/karma/node_modules/socket.io/lib/socket.js:335:8)
at Socket.onpacket (/Users/dror/workspace/kick-app/test-app/node_modules/karma/node_modules/socket.io/lib/socket.js:295:12)
at Client.ondecoded (/Users/dror/workspace/kick-app/test-app/node_modules/karma/node_modules/socket.io/lib/client.js:193:14)
at Decoder.Emitter.emit (/Users/dror/workspace/kick-app/test-app/node_modules/karma/node_modules/socket.io/node_modules/socket.io-parser/node_modules/component-emitter/index.js:134:20)
at Decoder.add (/Users/dror/workspace/kick-app/test-app/node_modules/karma/node_modules/socket.io/node_modules/socket.io-parser/index.js:247:12)
at Client.ondata (/Users/dror/workspace/kick-app/test-app/node_modules/karma/node_modules/socket.io/lib/client.js:175:18)
at emitOne (events.js:77:13)
at Socket.emit (events.js:169:7)
at Socket.onPacket (/Users/dror/workspace/kick-app/test-app/node_modules/karma/node_modules/socket.io/node_modules/engine.io/lib/socket.js:101:14)
at emitOne (events.js:77:13)
15 05 2016 15:01:32.228:WARN [Chrome 50.0.2661 (Mac OS X 10.11.4)]: Disconnected (1 times), because no message in 10000 ms.

Finished in 10.255 secs / 0.088 secs

15 05 2016 15:01:32.234:ERROR [karma]: [TypeError: sockets.forEach is not a function]
TypeError: sockets.forEach is not a function
at disconnectBrowsers (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:314:13)
at null. (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:291:7)
at emitTwo (events.js:92:20)
at emit (events.js:172:7)
at emitRunCompleteIfAllBrowsersDone (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:256:12)
at null. (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:278:9)
at emitOne (events.js:82:20)
at emit (events.js:169:7)
at null._onTimeout (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/browser.js:50:15)
at Timer.listOnTimeout (timers.js:92:15)
/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:314
sockets.forEach(function (socket) {
^

TypeError: sockets.forEach is not a function
at disconnectBrowsers (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:314:13)
at process. (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:355:5)
at emitOne (events.js:77:13)

15 05 2016 15:01:32.228:WARN [Chrome 50.0.2661 (Mac OS X 10.11.4)]: Disconnected (1 times), because no message in 10000 ms.

Finished in 10.255 secs / 0.088 secs

15 05 2016 15:01:32.234:ERROR [karma]: [TypeError: sockets.forEach is not a function]
TypeError: sockets.forEach is not a function
at disconnectBrowsers (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:314:13)
at null. (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:291:7)
at emitTwo (events.js:92:20)
at emit (events.js:172:7)
at emitRunCompleteIfAllBrowsersDone (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:256:12)
at null. (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:278:9)
at emitOne (events.js:82:20)
at emit (events.js:169:7)
at null._onTimeout (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/browser.js:50:15)
at Timer.listOnTimeout (timers.js:92:15)
/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:314
sockets.forEach(function (socket) {
^

TypeError: sockets.forEach is not a function
at disconnectBrowsers (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:314:13)
at process. (/Users/dror/workspace/kick-app/test-app/node_modules/karma/lib/server.js:355:5)
at emitOne (events.js:77:13)
at process.emit (events.js:169:7)
at process._fatalException (node.js:224:26)
✔ Done.

Suggestion:
Have a configuration to automatically add generated files to the current git repo. The configuration can be overriden in the generate command with a flag.

run npm install when a new package is added to package.json

There are leftovers of config in routes.js