Merge pull request #512 from Shopify/fix-asset-url

Fix asset url generated in slate-tools start
Shopify · Apr 25, 2018 · 8169df9 · 8169df9
2 parents fafb86f + 154f336
commit 8169df9
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 19 deletions.
diff --git a/packages/slate-liquid-asset-loader/index.js b/packages/slate-liquid-asset-loader/index.js
@@ -45,15 +45,15 @@ module.exports = function liquidLoader(content) {
     const key = `__LIQUID_LOADER_${getUniqueKey()}__`;
 
     // We're on a dev server, replace the whole liquid expression
-    if (options['dev-server']) {
+    if (options.devServer) {
       replacements[key] = file;
       return key;
     }
 
     const fileRegex = new RegExp(escapeStringRegexp(file));
 
     // Replace only the filename, keeping the liquid expression
-    return liquidExpr.replace(fileRegex, match => {
+    return liquidExpr.replace(fileRegex, (match) => {
       replacements[key] = match;
       return key;
     });
@@ -64,7 +64,7 @@ module.exports = function liquidLoader(content) {
   // Replace keys with a call to require(), correctly escaped
   return `module.exports = ${JSON.stringify(keyedContent).replace(
     llRegex,
-    match => {
+    (match) => {
       const request = utils.urlToRequest(replacements[match]);
       const path = utils.stringifyRequest(this, request);
 

diff --git a/packages/slate-tools/cli/commands/start.js b/packages/slate-tools/cli/commands/start.js
@@ -5,7 +5,6 @@ const ora = require('ora');
 const consoleControl = require('console-control-strings');
 const clearConsole = require('react-dev-utils/clearConsole');
 const openBrowser = require('react-dev-utils/openBrowser');
-const formatWebpackMessages = require('react-dev-utils/formatWebpackMessages');
 const env = require('@shopify/slate-env');
 const {event} = require('@shopify/slate-analytics');
 
@@ -37,40 +36,39 @@ devServer.compiler.hooks.compile.tap('CLI', () => {
 
 devServer.compiler.hooks.done.tap('CLI', (stats) => {
   const statsJson = stats.toJson({}, true);
-  const messages = formatWebpackMessages(statsJson);
 
   spinner.stop();
   clearConsole();
 
-  if (messages.errors.length) {
+  if (statsJson.errors.length) {
     event('slate-tools:start:compile-errors', {
-      errors: messages.errors,
+      errors: statsJson.errors,
       version: packageJson.version,
     });
 
     console.log(chalk.red('Failed to compile.\n'));
     console.log(config.paths.lib);
 
-    messages.errors.forEach((message) => {
+    statsJson.errors.forEach((message) => {
       console.log(`${message}\n`);
     });
   }
 
-  if (messages.warnings.length) {
+  if (statsJson.warnings.length) {
     event('slate-tools:start:compile-warnings', {
       duration: statsJson.time,
-      warnings: messages.warnings,
+      warnings: statsJson.warnings,
       version: packageJson.version,
     });
 
     console.log(chalk.yellow('Compiled with warnings.\n'));
 
-    messages.warnings.forEach((message) => {
+    statsJson.warnings.forEach((message) => {
       console.log(`${message}\n`);
     });
   }
 
-  if (!messages.errors.length && !messages.warnings.length) {
+  if (!statsJson.errors.length && !statsJson.warnings.length) {
     event('slate-tools:start:compile-success', {
       duration: statsJson.time,
       version: packageJson.version,

diff --git a/packages/slate-tools/tools/webpack/config/core.js b/packages/slate-tools/tools/webpack/config/core.js
@@ -124,13 +124,6 @@ module.exports = {
           name: '[name].[ext]',
         },
       },
-      {
-        test: /^(?:(?!(css|scss|sass|js)).)*\.(liquid)$/,
-        exclude: commonExcludes(),
-        loader: `extract-loader!@shopify/slate-liquid-asset-loader?dev-server=${
-          isDevServer ? 'true' : 'false'
-        }`,
-      },
       {
         test: /(css|scss|sass)\.liquid$/,
         exclude: commonExcludes(),

diff --git a/packages/slate-tools/tools/webpack/config/dev.js b/packages/slate-tools/tools/webpack/config/dev.js
@@ -30,6 +30,17 @@ module.exports = merge(
 
     module: {
       rules: [
+        {
+          test: /^(?:(?!(css|scss|sass)).)*\.(liquid)$/,
+          exclude: commonExcludes(),
+          use: [
+            {loader: 'extract-loader'},
+            {
+              loader: '@shopify/slate-liquid-asset-loader',
+              options: {devServer: true},
+            },
+          ],
+        },
         {
           test: /\.s[ac]ss$/,
           exclude: commonExcludes(),

diff --git a/packages/slate-tools/tools/webpack/config/prod.js b/packages/slate-tools/tools/webpack/config/prod.js
@@ -77,6 +77,17 @@ module.exports = merge(
 
     module: {
       rules: [
+        {
+          test: /^(?:(?!(css|scss|sass|js)).)*\.(liquid)$/,
+          exclude: commonExcludes(),
+          use: [
+            {loader: 'extract-loader'},
+            {
+              loader: '@shopify/slate-liquid-asset-loader',
+              options: {devServer: false},
+            },
+          ],
+        },
         {
           test: /\.s[ac]ss$/,
           exclude: commonExcludes(),