hayes0724/shopify-webpack-themekit

Shopify development tool using webpack and themekit

shopify-webpack-themekit's Issues

Most of the functionalities are broken

I downloaded the theme and noticed that the deploy command is broken there are folders that does not exist on the repo:

const chalk = require('chalk');
const {deploy, replace} = require('../../src/server/sync');
const promptContinueIfPublishedTheme = require('../../src/server/prompts/continue-if-published-theme');
const Environment = require('../../src/utilities/enviroment');

All those path are broken, also the hot reload is broken, the theme never uploads to shopify and most of the functionalities described on packer are not working on this repo. I spent all day trying to fix the bugs it has but discovered it was a waste of time, the project is useless on this conditions.

Issue with CleanWebpackPlugin

I am having an issue with CleanWebpack plugin when running npm run watch and npm start. There are no errors output, but occasionally the dev/assets server will hang and prevent updates. The only way to fix it is by ending watch.

Right now CleanWebpack is in wepack/parts/core.js and if I move it to prod.config.js, it seems to run smoother.

Is there a reason CleanWebpack should be kept in core.js? Or am I missing something where it should be kept in core?

I'd be happy to make a PR if that would work.

Code spat out and not reloading browser

Hey, I'm having an issue where code is spitting out at the bottom of the page, i know this was fixed in the latest slate version but do you know why it's happening on yours?

`");
} else {
win._boomrl = function() {
bootstrap();
};
if (win.addEventListener) {
win.addEventListener("load", win._boomrl, false);
} else if (win.attachEvent) {
win.attachEvent("onload", win._boomrl);
}
}
doc.close();
}
var link = document.createElement("link");
if (link.relList &&
typeof link.relList.supports === "function" &&
link.relList.supports("preload") &&
("as" in link)) {
window.BOOMR.snippetMethod = "p";
link.href = window.BOOMR.url;
link.rel = "preload";
link.as = "script";
link.addEventListener("load", promote);
link.addEventListener("error", function() {
iframeLoader(true);
});
setTimeout(function() {
if (!promoted) {
iframeLoader(true);
}
}, LOADER_TIMEOUT);
BOOMR_lstart = new Date().getTime();
parentNode.appendChild(link);
} else {
iframeLoader(false);
}
function boomerangSaveLoadTime(e) {
window.BOOMR_onload = (e && e.timeStamp) || new Date().getTime();
}
if (window.addEventListener) {
window.addEventListener("load", boomerangSaveLoadTime, false);
} else if (window.attachEvent) {
window.attachEvent("onload", boomerangSaveLoadTime);
}
if (document.addEventListener) {
document.addEventListener("onBoomerangLoaded", function(e) {
e.detail.BOOMR.init({
ResourceTiming: {
enabled: true,
trackedResourceTypes: ["script", "img", "css"]
},
});
e.detail.BOOMR.t_end = new Date().getTime();
});
} else if (document.attachEvent) {
document.attachEvent("onpropertychange", function(e) {
if (!e) e=event;
if (e.propertyName === "onBoomerangLoaded") {
e.detail.BOOMR.init({
ResourceTiming: {
enabled: true,
trackedResourceTypes: ["script", "img", "css"]
},
});
e.detail.BOOMR.t_end = new Date().getTime();
}
});
}
})();

if (!isDuplicatedThankYouPageView()) {
  setCookieIfThankYouPage();
  
    window.ShopifyAnalytics.lib.page(
      null,
      {"pageType":"home"}
    );
  
  
}

});`

Additionally whenever i make changes browsersync is not working, it seems to be hanging in the terminal.

Thanks

Missing functionalities

This package was looking as a good solution and starting point, but must of the functionalities have bugs and key commands as deploy is not working, also the hot reloading is not running and the theme is never uploaded. I also tried with the package that automate the process but same happens

From default not watching SCSS files

Splendid work on the setup! Was now still using a GULP based configuration, so a webpack basis is very welcome.

I just downloaded the entire pack and put a default theme in there, however, after npm run start or watch, the scss files are not being watched or compiled. It is successfully watching the liquid files and javascript, so the basic setup seems to be in order.

I tried the default files being supplied (theme.scss and theme.scss.liquid) and tried adding or modifying other possible combinations, however, no result.

Preferred way of pushing to production?

Hey there I was looking through the code and documentation but couldn't find the best / easiest way to push my production code to Shopify?

npm start build then zip & manual upload? I saw the deploy command was an empty file.

Coming from Slate, thank you for putting this together!

404 on 'compiled.scss.css'

I've followed adding {{ 'compiled.scss.css' | asset_url | stylesheet_tag }} to the theme.liquid file but when I run Webpack only the compiled.js is created which results in a 404 on compiled.scss.css. I've noticed the css/scss is staying within the compiled.js file instead of creating a separate compiled.scss.css file.

Any help would be appreciated.

Thanks.

hmr being included in build

I'm having an issue where it seems that hmr files are being included in the [email protected] when I build. Then if I deploy the theme there are many error related to hmr not being included.

I found that if I removed this part of the code in parts/core.js then hot-client.js won't be included in the build vendor build.

Object.keys(core.entry).forEach((name) => {
   core.entry[name] = [
       path.join(__dirname, '../../hot-client.js')
   ].concat(core.entry[name])
})

But that also makes hmr reloading not work in dev, so is there another solution to prevent hmr from getting included in the build?

npm start: Uncaught SyntaxError: missing ) after argument list

Hello! Great contribution btw.

But, I'm encountering an error when running npm run start . When the browser opens, input my store password, this shows up.

"); } else { win._boomrl = function() { bootstrap(); }; if (win.addEventListener) { win.addEventListener("load", win._boomrl, false); } else if (win.attachEvent) { win.attachEvent("onload", win._boomrl); } } doc.close(); } var link = document.createElement("link"); if (link.relList && typeof link.relList.supports === "function" && link.relList.supports("preload") && ("as" in link)) { window.BOOMR.snippetMethod = "p"; link.href = window.BOOMR.url; link.rel = "preload"; link.as = "script"; link.addEventListener("load", promote); link.addEventListener("error", function() { iframeLoader(true); }); setTimeout(function() { if (!promoted) { iframeLoader(true); } }, LOADER_TIMEOUT); BOOMR_lstart = new Date().getTime(); parentNode.appendChild(link); } else { iframeLoader(false); } function boomerangSaveLoadTime(e) { window.BOOMR_onload = (e && e.timeStamp) || new Date().getTime(); } if (window.addEventListener) { window.addEventListener("load", boomerangSaveLoadTime, false); } else if (window.attachEvent) { window.attachEvent("onload", boomerangSaveLoadTime); } if (document.addEventListener) { document.addEventListener("onBoomerangLoaded", function(e) { e.detail.BOOMR.init({ producer_url: "https://monorail-edge.shopifysvc.com/v1/produce", ResourceTiming: { enabled: true, trackedResourceTypes: ["script", "img", "css"] }, }); e.detail.BOOMR.t_end = new Date().getTime(); }); } else if (document.attachEvent) { document.attachEvent("onpropertychange", function(e) { if (!e) e=event; if (e.propertyName === "onBoomerangLoaded") { e.detail.BOOMR.init({ producer_url: "https://monorail-edge.shopifysvc.com/v1/produce", ResourceTiming: { enabled: true, trackedResourceTypes: ["script", "img", "css"] }, }); e.detail.BOOMR.t_end = new Date().getTime(); } }); } })(); window.ShopifyAnalytics.lib.page( null, {"pageType":"home"} ); var match = window.location.pathname.match(/checkouts\/(.+)\/(thank_you|post_purchase)/) var token = match? match[1]: undefined; if (!hasLoggedConversion(token)) { setCookieIfConversion(token); } }); var eventsListenerScript = document.createElement('script'); eventsListenerScript.async = true; eventsListenerScript.src = "//cdn.shopify.com/s/assets/shop_events_listener-d81deda6557a113fbcc6a993184828adcef6f241e4ca52b6a21169cb03169317.js"; document.getElementsByTagName('head')[0].appendChild(eventsListenerScript); })();

In the Chrome Dev Tools, I'm getting Uncaught SyntaxError: missing ) after argument list which makes sense but can't find where the issue lives.

Any idea?