Merge branch 'master' into tighter-manifest-key-prefix

Author: weaverryan

CHANGELOG.md

@@ -1,10 +1,22 @@
 # CHANGELOG
 
-## 0.12.0
+## 0.13.0
 
  * The `setManifestKeyPrefix()` method now forbids the key to
    start with a `/` - #105.
 
+## 0.12.0
+
+ * Fixed a bug with webpack 3.4.0 ("Can't resolve dev") - #114.
+
+ * Added `--keep-public-path` option to `dev-server` that allows
+   you to specify that you do *not* want your `publicPath` to
+   automatically point at the dev-server URL. Also relaxed the
+   requirements when using `dev-server` so that you *can* now
+   specify a custom, fully-qualified `publicPath` URL - #96
+
+ * Fixed bug where `@import` CSS wouldn't use postcss - #108
+
 ## 0.11.0
 
  * The `webpack` package was upgraded from version 2.2 to 3.1 #53. The

bin/encore.js

@@ -10,13 +10,12 @@
 
 'use strict';
 
-const path = require('path');
 const parseRuntime = require('../lib/config/parse-runtime');
 const context = require('../lib/context');
 const chalk = require('chalk');
 
 const runtimeConfig = parseRuntime(
-    require('yargs').argv,
+    require('yargs/yargs')(process.argv.slice(2)).argv,
     process.cwd()
 );
 context.runtimeConfig = runtimeConfig;
@@ -62,11 +61,14 @@ function showUsageInstructions() {
     console.log('Commands:');
     console.log(`    ${chalk.green('dev')}        : runs webpack for development`);
     console.log('       - Supports any webpack options (e.g. --watch)');
+    console.log();
     console.log(`    ${chalk.green('dev-server')} : runs webpack-dev-server`);
     console.log(`       - ${chalk.yellow('--host')} The hostname/ip address the webpack-dev-server will bind to`);
     console.log(`       - ${chalk.yellow('--port')} The port the webpack-dev-server will bind to`);
     console.log(`       - ${chalk.yellow('--hot')}  Enable HMR on webpack-dev-server`);
+    console.log(`       - ${chalk.yellow('--keep-public-path')} Do not change the public path (it is usually prefixed by the dev server URL)`);
     console.log('       - Supports any webpack-dev-server options');
+    console.log();
     console.log(`    ${chalk.green('production')} : runs webpack for production`);
     console.log('       - Supports any webpack options (e.g. --watch)');
     console.log();

fixtures/css/imports_autoprefixer.css

@@ -0,0 +1 @@
+@import "autoprefixer_test.css";

fixtures/css/same_filename.css

@@ -0,0 +1,17 @@
+h4 {
+  background: top left url('./../images/symfony_logo.png') no-repeat;
+}
+
+h5 {
+  background: top left url('./../images/same_filename/symfony_logo.png') no-repeat;
+}
+
+@font-face {
+    font-family: 'Roboto';
+    src: url('./../fonts/Roboto.woff2') format('woff2');
+}
+
+@font-face {
+    font-family: 'Roboto2';
+    src: url('./../fonts/same_filename/Roboto.woff2') format('woff2');
+}

fixtures/fonts/same_filename/Roboto.woff2

@@ -14,13 +14,17 @@ const configGenerator = require('./lib/config-generator');
 const validator = require('./lib/config/validator');
 const PrettyError = require('pretty-error');
 const runtimeConfig = require('./lib/context').runtimeConfig;
+const logger = require('./lib/logger');
 
 // at this time, the encore executable should have set the runtimeConfig
 if (!runtimeConfig) {
     throw new Error('Are you trying to require index.js directly?');
 }
 
 let webpackConfig = new WebpackConfig(runtimeConfig);
+if (runtimeConfig.verbose) {
+    logger.verbose();
+}
 
 module.exports = {
     /**
@@ -271,10 +275,20 @@ module.exports = {
      *
      * https://github.com/postcss/postcss-loader
      *
+     *     Encore.enablePostCssLoader();
+     *
+     * Or pass options to the loader
+     *
+     *     Encore.enablePostCssLoader(function(options) {
+     *         // https://github.com/postcss/postcss-loader#options
+     *         // options.config = {...}
+     *     })
+     *
+     * @param {function} postCssLoaderOptionsCallback
      * @return {exports}
      */
-    enablePostCssLoader() {
-        webpackConfig.enablePostCssLoader();
+    enablePostCssLoader(postCssLoaderOptionsCallback = () => {}) {
+        webpackConfig.enablePostCssLoader(postCssLoaderOptionsCallback);
 
         return this;
     },
@@ -376,6 +390,23 @@ module.exports = {
         return this;
     },
 
+    /**
+     * Call this to enable forked type checking for TypeScript loader
+     * https://github.com/TypeStrong/ts-loader/blob/v2.3.0/README.md#faster-builds
+     *
+     * This is a build optimization API to reduce build times.
+     *
+     * @param {function} forkedTypeScriptTypesCheckOptionsCallback
+     * @return {exports}
+     */
+    enableForkedTypeScriptTypesChecking(forkedTypeScriptTypesCheckOptionsCallback = () => {}) {
+        webpackConfig.enableForkedTypeScriptTypesChecking(
+            forkedTypeScriptTypesCheckOptionsCallback
+        );
+
+        return this;
+    },
+
     /**
      * If enabled, the Vue.js loader is enabled.
      *

fixtures/images/same_filename/symfony_logo.png

@@ -40,6 +40,7 @@ class WebpackConfig {
         this.useVersioning = false;
         this.useSourceMaps = false;
         this.usePostCssLoader = false;
+        this.postCssLoaderOptionsCallback = function() {};
         this.useSassLoader = false;
         this.sassLoaderOptionsCallback = function() {};
         this.sassOptions = {
@@ -56,6 +57,8 @@ class WebpackConfig {
         this.loaders = [];
         this.useTypeScriptLoader = false;
         this.tsConfigurationCallback = function() {};
+        this.useForkedTypeScriptTypeChecking = false;
+        this.forkedTypeScriptTypesCheckOptionsCallback = () => {};
     }
 
     getContext() {
@@ -86,23 +89,11 @@ class WebpackConfig {
     }
 
     setPublicPath(publicPath) {
-        /*
-         * Do not allow absolute URLs *and* the webpackDevServer
-         * to be used at the same time. The webpackDevServer basically
-         * provides the publicPath (and so in those cases, publicPath)
-         * is simply used as the default manifestKeyPrefix.
-         */
-        if (publicPath.includes('://')) {
-            if (this.useDevServer()) {
-                throw new Error('You cannot pass an absolute URL to setPublicPath() and use the dev-server at the same time. Try using Encore.isProduction() to only configure your absolute publicPath for production.');
-            }
-        } else {
-            if (publicPath.indexOf('/') !== 0) {
-                // technically, not starting with "/" is legal, but not
-                // what you want in most cases. Let's not let the user make
-                // a mistake (and we can always change this later).
-                throw new Error('The value passed to setPublicPath() must start with "/" or be a full URL (http://...)');
-            }
+        if (publicPath.includes('://') === false && publicPath.indexOf('/') !== 0) {
+            // technically, not starting with "/" is legal, but not
+            // what you want in most cases. Let's not let the user make
+            // a mistake (and we can always change this later).
+            throw new Error('The value passed to setPublicPath() must start with "/" or be a full URL (http://...)');
         }
 
         // guarantee a single trailing slash
@@ -141,13 +132,20 @@ class WebpackConfig {
      * @returns {string}
      */
     getRealPublicPath() {
-        // if we're using webpack-dev-server, use it & add the publicPath
-        if (this.useDevServer()) {
-            // avoid 2 middle slashes
-            return this.runtimeConfig.devServerUrl.replace(/\/$/,'') + this.publicPath;
+        if (!this.useDevServer()) {
+            return this.publicPath;
+        }
+
+        if (this.runtimeConfig.devServerKeepPublicPath) {
+            return this.publicPath;
+        }
+
+        if (this.publicPath.includes('://')) {
+            return this.publicPath;
         }
 
-        return this.publicPath;
+        // if using dev-server, prefix the publicPath with the dev server URL
+        return this.runtimeConfig.devServerUrl.replace(/\/$/,'') + this.publicPath;
     }
 
     addEntry(name, src) {
@@ -215,8 +213,14 @@ class WebpackConfig {
         this.addEntry(name, files);
     }
 
-    enablePostCssLoader() {
+    enablePostCssLoader(postCssLoaderOptionsCallback = () => {}) {
         this.usePostCssLoader = true;
+
+        if (typeof postCssLoaderOptionsCallback !== 'function') {
+            throw new Error('Argument 1 to enablePostCssLoader() must be a callback function.');
+        }
+
+        this.postCssLoaderOptionsCallback = postCssLoaderOptionsCallback;
     }
 
     enableSassLoader(sassLoaderOptionsCallback = () => {}, options = {}) {
@@ -255,6 +259,17 @@ class WebpackConfig {
         this.tsConfigurationCallback = callback;
     }
 
+    enableForkedTypeScriptTypesChecking(forkedTypeScriptTypesCheckOptionsCallback = () => {}) {
+
+        if (typeof forkedTypeScriptTypesCheckOptionsCallback !== 'function') {
+            throw new Error('Argument 1 to enableForkedTypeScriptTypesChecking() must be a callback function.');
+        }
+
+        this.useForkedTypeScriptTypeChecking = true;
+        this.forkedTypeScriptTypesCheckOptionsCallback =
+            forkedTypeScriptTypesCheckOptionsCallback;
+    }
+
     enableVueLoader(vueLoaderOptionsCallback = () => {}) {
         this.useVueLoader = true;