{"action":"created","issue":{"url":"https://api.github.com/repos/ampedandwired/html-webpack-plugin/issues/276","repository_url":"https://api.github.com/repos/ampedandwired/html-webpack-plugin","labels_url":"https://api.github.com/repos/ampedandwired/html-webpack-plugin/issues/276/labels{/name}","comments_url":"https://api.github.com/repos/ampedandwired/html-webpack-plugin/issues/276/comments","events_url":"https://api.github.com/repos/ampedandwired/html-webpack-plugin/issues/276/events","html_url":"https://github.com/ampedandwired/html-webpack-plugin/issues/276","id":144699152,"number":276,"title":"lodash not compiling on upgrade from 1.7 to 2.x","user":{"login":"dougvk","id":401660,"avatar_url":"https://avatars.githubusercontent.com/u/401660?v=3","gravatar_id":"","url":"https://api.github.com/users/dougvk","html_url":"https://github.com/dougvk","followers_url":"https://api.github.com/users/dougvk/followers","following_url":"https://api.github.com/users/dougvk/following{/other_user}","gists_url":"https://api.github.com/users/dougvk/gists{/gist_id}","starred_url":"https://api.github.com/users/dougvk/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/dougvk/subscriptions","organizations_url":"https://api.github.com/users/dougvk/orgs","repos_url":"https://api.github.com/users/dougvk/repos","events_url":"https://api.github.com/users/dougvk/events{/privacy}","received_events_url":"https://api.github.com/users/dougvk/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":2,"created_at":"2016-03-30T19:40:05Z","updated_at":"2016-03-30T20:02:05Z","closed_at":null,"body":"```ERROR in HtmlWebpackPlugin Error: Child compilation failed:\r\nModule build failed: SyntaxError: Unexpected token :\r\n    at Function (native)\r\n    at /Users/dougvk/code/nqv2/node_modules/lodash/index.js:10809:16\r\n    at /Users/dougvk/code/nqv2/node_modules/lodash/index.js:11082:21\r\n    at /Users/dougvk/code/nqv2/node_modules/lodash/index.js:8152:31\r\n    at Function.template (/Users/dougvk/code/nqv2/node_modules/lodash/index.js:10808:20)\r\n    at Object.module.exports (/Users/dougvk/code/nqv2/node_modules/html-webpack-plugin/loader.js:18:20):\r\nSyntaxError: Unexpected token :\r\nChild html-webpack-plugin for \"index.html\":```\r\n\r\n    ERROR in ./~/html-webpack-plugin/loader.js!./src/production.index.html\r\n    Module build failed: SyntaxError: Unexpected token :\r\n        at Function (native)\r\n        at /Users/dougvk/code/nqv2/node_modules/lodash/index.js:10809:16\r\n        at /Users/dougvk/code/nqv2/node_modules/lodash/index.js:11082:21\r\n        at /Users/dougvk/code/nqv2/node_modules/lodash/index.js:8152:31\r\n        at Function.template (/Users/dougvk/code/nqv2/node_modules/lodash/index.js:10808:20)\r\n        at Object.module.exports (/Users/dougvk/code/nqv2/node_modules/html-webpack-plugin/loader.js:18:20)\r\n```\r\ndepending on the version of html-webpack-plugin i use, it complains about different lines of lodash. the problem isnt uglifyjs, either, as i removed that plugin and the error still occurred. any ideas?"},"comment":{"url":"https://api.github.com/repos/ampedandwired/html-webpack-plugin/issues/comments/203609531","html_url":"https://github.com/ampedandwired/html-webpack-plugin/issues/276#issuecomment-203609531","issue_url":"https://api.github.com/repos/ampedandwired/html-webpack-plugin/issues/276","id":203609531,"user":{"login":"dougvk","id":401660,"avatar_url":"https://avatars.githubusercontent.com/u/401660?v=3","gravatar_id":"","url":"https://api.github.com/users/dougvk","html_url":"https://github.com/dougvk","followers_url":"https://api.github.com/users/dougvk/followers","following_url":"https://api.github.com/users/dougvk/following{/other_user}","gists_url":"https://api.github.com/users/dougvk/gists{/gist_id}","starred_url":"https://api.github.com/users/dougvk/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/dougvk/subscriptions","organizations_url":"https://api.github.com/users/dougvk/orgs","repos_url":"https://api.github.com/users/dougvk/repos","events_url":"https://api.github.com/users/dougvk/events{/privacy}","received_events_url":"https://api.github.com/users/dougvk/received_events","type":"User","site_admin":false},"created_at":"2016-03-30T20:02:05Z","updated_at":"2016-03-30T20:02:05Z","body":"import webpack from 'webpack'\r\nimport cssnano from 'cssnano'\r\nimport HtmlWebpackPlugin from 'html-webpack-plugin'\r\nimport ExtractTextPlugin from 'extract-text-webpack-plugin'\r\nimport config from '../config'\r\nimport _debug from 'debug'\r\n\r\nconst debug = _debug('app:webpack:config')\r\nconst paths = config.utils_paths\r\nconst {__DEV__, __PROD__, __TEST__} = config.globals\r\n\r\ndebug('Create configuration.')\r\nconst webpackConfig = {\r\n  name: 'client',\r\n  target: 'web',\r\n  devtool: config.compiler_devtool,\r\n  resolve: {\r\n    root: paths.base(config.dir_client),\r\n    extensions: ['', '.js', '.jsx', '.json']\r\n  },\r\n  module: {}\r\n}\r\n// ------------------------------------\r\n// Entry Points\r\n// ------------------------------------\r\nconst APP_ENTRY_PATH = paths.base(config.dir_client) + '/main.js'\r\n\r\nwebpackConfig.entry = {\r\n  app: __DEV__\r\n    ? [APP_ENTRY_PATH, `webpack-hot-middleware/client?path=${config.compiler_public_path}__webpack_hmr`]\r\n    : [APP_ENTRY_PATH],\r\n  vendor: config.compiler_vendor\r\n}\r\n\r\n// ------------------------------------\r\n// Bundle Output\r\n// ------------------------------------\r\nwebpackConfig.output = {\r\n  filename: `[name].js`,\r\n  path: paths.base(config.dir_dist),\r\n  publicPath: config.compiler_public_path\r\n}\r\n\r\n// ------------------------------------\r\n// Plugins\r\n// ------------------------------------\r\nwebpackConfig.plugins = [\r\n  new webpack.DefinePlugin(config.globals),\r\n]\r\n\r\nif (__DEV__) {\r\n  debug('Enable plugins for live development (HMR, NoErrors).')\r\n  webpackConfig.plugins.push(\r\n    new HtmlWebpackPlugin({\r\n      template: paths.client('index.html'),\r\n      hash: false,\r\n      favicon: paths.client('static/favicon.ico'),\r\n      filename: 'index.html',\r\n      inject: 'body',\r\n      minify: {\r\n        collapseWhitespace: true\r\n      }\r\n    }),\r\n    new webpack.HotModuleReplacementPlugin(),\r\n    new webpack.NoErrorsPlugin()\r\n  )\r\n} else if (__PROD__) {\r\n  debug('Enable plugins for production (OccurenceOrder, Dedupe & UglifyJS).')\r\n  webpackConfig.plugins.push(\r\n    new HtmlWebpackPlugin({\r\n      template: paths.client('production.index.html'),\r\n      hash: false,\r\n      favicon: paths.client('static/favicon.ico'),\r\n      filename: 'index.html',\r\n      minify: {\r\n        collapseWhitespace: true\r\n      }\r\n    }),\r\n    new webpack.optimize.OccurrenceOrderPlugin(),\r\n    new webpack.optimize.DedupePlugin(),\r\n    new webpack.optimize.UglifyJsPlugin({\r\n      compress: {\r\n        unused: true,\r\n        dead_code: true,\r\n        warnings: false\r\n      }\r\n    })\r\n  )\r\n}\r\n\r\n// Don't split bundles during testing, since we only want import one bundle\r\nif (!__TEST__) {\r\n  webpackConfig.plugins.push(new webpack.optimize.CommonsChunkPlugin({\r\n    names: ['vendor']\r\n  }))\r\n}\r\n\r\n// ------------------------------------\r\n// Pre-Loaders\r\n// ------------------------------------\r\n/*\r\n[ NOTE ]\r\nWe no longer use eslint-loader due to it severely impacting build\r\ntimes for larger projects. `npm run lint` still exists to aid in\r\ndeploy processes (such as with CI), and it's recommended that you\r\nuse a linting plugin for your IDE in place of this loader.\r\n\r\nIf you do wish to continue using the loader, you can uncomment\r\nthe code below and run `npm i --save-dev eslint-loader`. This code\r\nwill be removed in a future release.\r\n\r\nwebpackConfig.module.preLoaders = [{\r\n  test: /\\.(js|jsx)$/,\r\n  loader: 'eslint',\r\n  exclude: /node_modules/\r\n}]\r\n\r\nwebpackConfig.eslint = {\r\n  configFile: paths.base('.eslintrc'),\r\n  emitWarning: __DEV__\r\n}\r\n*/\r\n\r\n// ------------------------------------\r\n// Loaders\r\n// ------------------------------------\r\n// JavaScript / JSON\r\nwebpackConfig.module.loaders = [{\r\n  test: /\\.(js|jsx)$/,\r\n  exclude: /node_modules/,\r\n  loader: 'babel',\r\n  query: {\r\n    cacheDirectory: true,\r\n    plugins: ['transform-runtime'],\r\n    presets: ['es2015', 'react', 'stage-0'],\r\n    env: {\r\n      development: {\r\n        plugins: [\r\n          ['react-transform', {\r\n            transforms: [{\r\n              transform: 'react-transform-hmr',\r\n              imports: ['react'],\r\n              locals: ['module']\r\n            }, {\r\n              transform: 'react-transform-catch-errors',\r\n              imports: ['react', 'redbox-react']\r\n            }]\r\n          }]\r\n        ]\r\n      },\r\n      production: {\r\n        plugins: [\r\n          'transform-react-remove-prop-types',\r\n          'transform-react-constant-elements'\r\n        ]\r\n      }\r\n    }\r\n  }\r\n},\r\n{\r\n  test: /\\.json$/,\r\n  loader: 'json'\r\n}]\r\n\r\n// ------------------------------------\r\n// Style Loaders\r\n// ------------------------------------\r\n// We use cssnano with the postcss loader, so we tell\r\n// css-loader not to duplicate minimization.\r\nconst BASE_CSS_LOADER = 'css?sourceMap&-minimize'\r\n\r\n// Add any packge names here whose styles need to be treated as CSS modules.\r\n// These paths will be combined into a single regex.\r\nconst PATHS_TO_TREAT_AS_CSS_MODULES = [\r\n  // 'react-toolbox', (example)\r\n]\r\n\r\n// If config has CSS modules enabled, treat this project's styles as CSS modules.\r\nif (config.compiler_css_modules) {\r\n  PATHS_TO_TREAT_AS_CSS_MODULES.push(\r\n    paths.base(config.dir_client).replace(/[\\^\\$\\.\\*\\+\\-\\?\\=\\!\\:\\|\\\\\\/\\(\\)\\[\\]\\{\\}\\,]/g, '\\\\$&')\r\n  )\r\n}\r\n\r\nconst isUsingCSSModules = !!PATHS_TO_TREAT_AS_CSS_MODULES.length\r\nconst cssModulesRegex = new RegExp(`(${PATHS_TO_TREAT_AS_CSS_MODULES.join('|')})`)\r\n\r\n// Loaders for styles that need to be treated as CSS modules.\r\nif (isUsingCSSModules) {\r\n  const cssModulesLoader = [\r\n    BASE_CSS_LOADER,\r\n    'modules',\r\n    'importLoaders=1',\r\n    'localIdentName=[name]__[local]___[hash:base64:5]'\r\n  ].join('&')\r\n\r\n  webpackConfig.module.loaders.push({\r\n    test: /\\.scss$/,\r\n    include: cssModulesRegex,\r\n    loaders: [\r\n      'style',\r\n      cssModulesLoader,\r\n      'postcss',\r\n      'sass?sourceMap'\r\n    ]\r\n  })\r\n\r\n  webpackConfig.module.loaders.push({\r\n    test: /\\.css$/,\r\n    include: cssModulesRegex,\r\n    loaders: [\r\n      'style',\r\n      cssModulesLoader,\r\n      'postcss'\r\n    ]\r\n  })\r\n}\r\n\r\n// Loaders for files that should not be treated as CSS modules.\r\nconst excludeCSSModules = isUsingCSSModules ? cssModulesRegex : false\r\nwebpackConfig.module.loaders.push({\r\n  test: /\\.scss$/,\r\n  exclude: excludeCSSModules,\r\n  loaders: [\r\n    'style',\r\n    BASE_CSS_LOADER,\r\n    'postcss',\r\n    'sass?sourceMap'\r\n  ]\r\n})\r\nwebpackConfig.module.loaders.push({\r\n  test: /\\.css$/,\r\n  exclude: excludeCSSModules,\r\n  loaders: [\r\n    'style',\r\n    BASE_CSS_LOADER,\r\n    'postcss'\r\n  ]\r\n})\r\n\r\n// ------------------------------------\r\n// Style Configuration\r\n// ------------------------------------\r\nwebpackConfig.sassLoader = {\r\n  includePaths: paths.client('styles')\r\n}\r\n\r\nwebpackConfig.postcss = [\r\n  cssnano({\r\n    autoprefixer: {\r\n      add: true,\r\n      remove: true,\r\n      browsers: ['last 2 versions']\r\n    },\r\n    discardComments: {\r\n      removeAll: true\r\n    },\r\n    discardUnused: false,\r\n    mergeIdents: false,\r\n    reduceIdents: false,\r\n    safe: true,\r\n    sourcemap: true\r\n  })\r\n]\r\n\r\n// File loaders\r\n/* eslint-disable */\r\nwebpackConfig.module.loaders.push(\r\n  { test: /\\.woff(\\?.*)?$/,  loader: 'url?prefix=fonts/&name=[path][name].[ext]&limit=10000&mimetype=application/font-woff' },\r\n  { test: /\\.woff2(\\?.*)?$/, loader: 'url?prefix=fonts/&name=[path][name].[ext]&limit=10000&mimetype=application/font-woff2' },\r\n  { test: /\\.otf(\\?.*)?$/,   loader: 'file?prefix=fonts/&name=[path][name].[ext]&limit=10000&mimetype=font/opentype' },\r\n  { test: /\\.ttf(\\?.*)?$/,   loader: 'url?prefix=fonts/&name=[path][name].[ext]&limit=10000&mimetype=application/octet-stream' },\r\n  { test: /\\.eot(\\?.*)?$/,   loader: 'file?prefix=fonts/&name=[path][name].[ext]' },\r\n  { test: /\\.svg(\\?.*)?$/,   loader: 'url?prefix=fonts/&name=[path][name].[ext]&limit=10000&mimetype=image/svg+xml' },\r\n  { test: /\\.(png|jpg)$/,    loader: 'url?limit=8192' }\r\n)\r\n/* eslint-enable */\r\n\r\n// ------------------------------------\r\n// Finalize Configuration\r\n// ------------------------------------\r\n// when we don't know the public path (we know it only when HMR is enabled [in development]) we\r\n// need to use the extractTextPlugin to fix this issue:\r\n// http://stackoverflow.com/questions/34133808/webpack-ots-parsing-error-loading-fonts/34133809#34133809\r\nif (!__DEV__) {\r\n  debug('Apply ExtractTextPlugin to CSS loaders.')\r\n  webpackConfig.module.loaders.filter((loader) =>\r\n    loader.loaders && loader.loaders.find((name) => /css/.test(name.split('?')[0]))\r\n  ).forEach((loader) => {\r\n    const [first, ...rest] = loader.loaders\r\n    loader.loader = ExtractTextPlugin.extract(first, rest.join('!'))\r\n    delete loader.loaders\r\n  })\r\n\r\n  webpackConfig.plugins.push(\r\n    new ExtractTextPlugin('[name].css', {\r\n      allChunks: true\r\n    })\r\n  )\r\n}\r\n\r\nexport default webpackConfig"}}