ERROR in file.js from UglifyJs SyntaxError: Unexpected token: name (xxxxx) [file.js:line,column]

Recently whilst upgrading from Webpack to Webpack2, I ran into this error which took a while to debug.

I was seeing the following error output:

ERROR in file.js from UglifyJs
SyntaxError: Unexpected token: name (DateRange) [file.js:line,column]
I went into my webpack config and turned minification off so that I could see the file which was being generated:

plugins: [
    ...
    new webpack.LoaderOptionsPlugin({
      minimize: false,
      debug: false
    }),
    new webpack.optimiz...
Read More

Conditionally load multiple Polyfills using Webpack, Promises and Code Splitting

For my latest react project, I wanted to be able to polyfill certain features which are missing in older browsers, yet not include them in my final code bundle if the browser the user is using already supports that feature.

This was a great problem for webpack's code splitting feature to solve!

After a quick google, I found a post from Ian Obermiller which set me on the correct path, however the post didn't expand on how to load multiple polyfills conditionally.

For example:
  • Safari is missing...
Read More

Output filename not configured error from Webpack

I couldn't find an answer to this simple issue, so I thought I'd quickly post one myself.

Whilst creating a new ReactJS app, I wanted to use Webpack to build all of my modules into a single bundle.

I had installed it globally by running npm install webpack -g and I had included it in my project by running npm install webpack --save-dev.

However, on running the webpack command, I was seeing the following output:
Output filename not configured.

The solution

Turns out it was simple. I had missed th...
Read More

Using PrismJS with RequireJS and loading plugins asynchronously

Whilst developing my site, I came across a beautiful syntax highlighter called PrismJS which I wanted to use, however, it is not built out of the box for use with AMD APIs such as RequireJS.

I wanted to enable a few features with PrismJS and RequireJS, namely, the ability to:
  • Load PrismJS through RequireJS and have it highlight code elements.
  • Dynamically load the necessary language files so that code blocks can be highlighted with the correct language definitions.
  • Load plugins so that I could use...
Read More

Doctrine PrePersist and PreUpdate functions not working

Whilst developing my site, I was finding that my PrePersist (on creation) and PreUpdate (on update) doctrine2 lifecycle callbacks weren't being triggered:

/**
 * @ORM\PrePersist
 */
protected function prePersist()
{
    $this->dateCreated = new \DateTime();
    $this->deleted = false;
}

/**
 * @ORM\PreUpdate
 */
protected function preUpdate()
{
    $this->dateUpdated = new \DateTime();
}

The Solution

PrePersist and PreUpdate function must be public functions in your entities. Chan...
Read More

Symfony2 Assetic with LESS generating empty files on Unix

Yesterday, I tried running the following command using the symfony console to dump my LESS files into a static CSS file, for my site:
php app/console assetic:dump --env=prod --no-debug
On doing so, when I visited my site, no CSS styling had been applied, and when checking the generated file in the /web/bundles/ folder, it was empty.

I'd recently had issues installing and running composer on my fresh installation of Ubuntu, so I assumed it would be a similar issue, namely around the php.ini settin...
Read More

Issues with globally installing Composer on Ubuntu under root

Whilst trying to install composer globally, using my root account, I was running into a strange problem when running the command
curl -sS https://getcomposer.org/installer | php
At first, I was only seeing the following:

root@machine:/home/websites$ curl -sS https://getcomposer.org/installer | php
#!/usr/bin/env php
All settings correct for using Composer
root@machine:/home/websites$
PHP was hiding any errors I was meant to see, as I had set my system to use production settings. I turned on PH...
Read More

Symfony2 Web Debug Toolbar 500 Internal Server Error based on getTemplateClass

I came across a strange issue today whilst developing on symfony2. On a very bare installation of symfony, every time I refreshed the page, I came across the following error:

An error occurred while loading the web debug toolbar (500 internal server error)
I'd then have the option to view the profiler or cancel.
On viewing the profiler, I saw the following:

Error: Maximum function nesting level of '100' reached, aborting!
500 Internal Server Error - FatalErrorException
and the initial stack tra...
Read More

Secure Password hashing using PHP, bcrypt and the password hash function

PHP 5.5 gives us a secure way to hash and store passwords in our database, using a simple built in function called password_hash. We can then easily verify that password using it's sibling function password_verify.

Using the function is very simple, and incredibly secure. password_hash actually bakes in a lot of good practices when storing passwords, so we don't have to worry about doing it manually.

Good Practice: Cost Factor

The function allows a cost factor to increase the complexity of the h...
Read More

Cache Design Patterns: Namespacing and Cache Expiration

Memcached is a caching daemon used in PHP to speed up dynamic data driven applications by store objects and data in memory; it's main use is to reduce the number of times we have to recall these objects from external data sources (e.g. DBs and APIs), as reading from these sources is generally slower than reading from memory.

However, on large scale applications, it's not trivial to implement a good caching system, usually because of invalidation issues. When a user performs an action to update ...
Read More