fix: dev server not detecting liquid file changes

CHANGELOG.md

@@ -1,3 +1,22 @@
+## [2.0.10](https://github.com/hayes0724/shopify-packer/compare/2.0.9...2.0.10) (2021-03-28)
+
+
+### :art: Styles
+
+* removed unused variable and ran prettier ([a14dc67](https://github.com/hayes0724/shopify-packer/commit/a14dc67a536637a099f82a1e1548c7f6b05c2219))
+
+
+### :bug: Bug Fixes
+
+* dev server not detecting liquid file changes ([9301ce5](https://github.com/hayes0724/shopify-packer/commit/9301ce5b9c578c60ca3a2c08888ffd0622f25d51))
+
+
+### :wrench: Continuous Integration
+
+* Tests now run on macos and windows and linting added ([64166ef](https://github.com/hayes0724/shopify-packer/commit/64166efbda66c3c31768bf10b27fa8c997d41755))
+
+
+
 ## [2.0.8](https://github.com/hayes0724/shopify-packer/compare/2.0.7...2.0.8) (2021-03-28)
 
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hayes0724/shopify-packer",
-  "version": "2.0.9",
+  "version": "2.0.10",
   "bin": {
     "packer": "cli/index.js"
   },

src/server/asset/index.js

@@ -55,7 +55,9 @@ module.exports = class AssetServer {
       return this.updates.add(`snippets/${path.basename(file)}`);
     }
     if (this._isLiquidFile(file) && this._hasAssetChanged(file, info)) {
-      return this.updates.add(file.replace('../', ''));
+      return this.updates.add(
+        file.replace(`..${path.sep}`, '').replace(`../`, '')
+      );
     }
     if (
       !this._isLiquidFile(file) &&

src/webpack/config/dev.config.js

@@ -3,6 +3,7 @@ const webpack = require('webpack');
 const {merge} = require('webpack-merge');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const HtmlWebpackTagsPlugin = require('html-webpack-tags-plugin');
+const {CleanWebpackPlugin} = require('clean-webpack-plugin');
 const PackerConfig = require('../../config');
 const config = new PackerConfig(require('../../../packer.schema'));
 const development = process.env.NODE_ENV !== 'production';
@@ -13,6 +14,7 @@ const core = require('../parts/core');
 const css = require('../parts/css');
 const scss = require('../parts/scss');
 const liquidStyles = require('../parts/liquid-styles');
+const copy = require('../parts/copy');
 
 const mergeDev = customConfigCheck(config.get('merge.dev'));
 config.set('files.layout', getLayoutEntrypoints());
@@ -35,6 +37,7 @@ module.exports = merge([
   core,
   scss,
   css,
+  copy,
   {
     mode: 'development',
     devtool: false,
@@ -68,6 +71,8 @@ module.exports = merge([
       ],
     },
     plugins: [
+      new CleanWebpackPlugin(),
+
       new webpack.DefinePlugin({
         'process.env': {NODE_ENV: '"development"'},
       }),
@@ -106,11 +111,6 @@ module.exports = merge([
         links: ['layout.theme.styleLiquid.css'],
         append: true,
       }),
-
-      new HtmlWebpackTagsPlugin({
-        links: ['layout.theme.styleLiquid.css'],
-        append: true,
-      }),
     ],
   },
   mergeDev,

src/webpack/config/prod.config.js

@@ -11,15 +11,15 @@ process.env.NODE_ENV = 'production';
 const {customConfigCheck} = require('../custom');
 const getLayoutEntrypoints = require('../../utilities/get-layout-entrypoints');
 const getTemplateEntrypoints = require('../../utilities/get-template-entrypoints');
-const clean = require('../parts/clean');
-const copy = require('../parts/copy');
 config.set('files.layout', getLayoutEntrypoints());
 config.set('files.template', getTemplateEntrypoints());
 
 // Parts
 const core = require('../parts/core');
 const css = require('../parts/css');
 const scss = require('../parts/scss');
+const clean = require('../parts/clean');
+const copy = require('../parts/copy');
 const optimization = require('../parts/optimization');
 const liquidStyles = require('../parts/liquid-styles');
 const mergeProd = customConfigCheck(config.get('merge.prod'));

src/webpack/parts/copy.js

@@ -12,27 +12,27 @@ const copy = {
         },
         {
           from: config.get('theme.src.layout'),
-          to: config.get('theme.dist.layout'),
+          to: `${config.get('theme.dist.layout')}/[name][ext]`,
         },
         {
           from: config.get('theme.src.config'),
-          to: config.get('theme.dist.config'),
+          to: `${config.get('theme.dist.config')}/[name][ext]`,
         },
         {
           from: config.get('theme.src.locales'),
-          to: config.get('theme.dist.locales'),
+          to: `${config.get('theme.dist.locales')}/[name][ext]`,
         },
         {
           from: config.get('theme.src.snippets'),
-          to: config.get('theme.dist.snippets'),
+          to: `${config.get('theme.dist.snippets')}/[name][ext]`,
         },
         {
           from: config.get('theme.src.templates'),
-          to: config.get('theme.dist.templates'),
+          to: `${config.get('theme.dist.templates')}/[name][ext]`,
         },
         {
           from: config.get('theme.src.sections'),
-          to: config.get('theme.dist.sections'),
+          to: `${config.get('theme.dist.sections')}/[name][ext]`,
         },
       ],
     }),