vigetlabs / blendid

A delicious blend of gulp tasks combined into a configurable asset pipeline and static site builder
MIT License
4.97k stars 683 forks source link

How to add 'Modernizr' #511

Closed MrMchaD closed 6 years ago

MrMchaD commented 6 years ago

Hi Community. I'm new to blendid / gulp starter and wanted to give it a try, as it seems to be a great way to work to me for future projects. So i started a project today but already have some troubles. Without anything else done for now i tried to add modernizr to my project ... it has been installed via npm correctly to my node modules but i'm lost where i should add a task. task-config.js? Or task-default.js? And how should i add it? This is learning by doing for me, sorry for the probably noobish question. :(

macouella commented 6 years ago

Hey, here's an excerpt of my config file. You will need to add modernizrrc under javascripts loaders. You will need a modernizrrc in your project root or you can update the path below to point to wherever you want to store the modernizrrc file.

# ~/config/task-config.js
const path = require('path');
module.exports = {
  javascripts: {
    entry: {
      app: ['app.js']
    },
    loaders: [
      {
        test: /\.modernizrrc.js$/,
        use: ['modernizr-loader']
      },
      {
        test: /\.modernizrrc(\.json)?$/,
        use: ['modernizr-loader', 'json-loader']
      }
    ],
    customizeWebpackConfig: (webpackConfig, env, webpack) => {
      webpackConfig.resolve.alias = webpackConfig.resolve.alias || {};
      webpackConfig.resolve.alias.modernizr$ = path.resolve(
        __dirname,
        '..',
        '.modernizrrc'
      );
      return webpackConfig;
    },
  }
};

Example modernizrrc file below. You can generate one from the Modernizr website.

# ~/.modernizrrc
{
  "options": [
    "setClasses"
  ],
  "feature-detects": [
    "css/transforms",
    "cors",
    "touchevents"
  ]
}
benjtinsley commented 6 years ago

@MrMchaD did the suggestion from @igimanaloto work for you? i will close this unless there are other problems you encounter