将Shopify的主题开发框架Slate与CSS框架相结合Materialise

-1

我需要将Slate目录复制到Materialise文件中？我设法用将Shopify的主题开发框架Slate与CSS框架相结合Materialise

<!-- Compiled and minified CSS --> 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.2/css/materialize.min.css"> 
<!-- Compiled and minified JavaScript --> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.2/js/materialize.min.js"></script>

创建物化布局然后我复制了Materialise公司/上海社会科学院文件夹石板/全球目录的内容，增加了行

<!--Import materialize.css--> 
{{ 'materialize.scss' | asset_url | stylesheet_tag }}

到我theme.liquid和跑石板构建，部署和观看。无法看到上传到我的主题文件的物化文件。我究竟做错了什么？

来源

2017-04-24 zinyosrim

复制兑现在目录SASS SCSS的文件/文件，以产生石板的src /风格/供应商目录

添加以下代码的src /风格/ theme.scss

 /*================ MODULES ================*/ 
     @import url('modules/site-header.scss'); 
     @import url('modules/gift-card-template.scss'); 

     /*================ Materialize ===========*/ 
     @import url('vendor/materialize/materialize.scss'); 
     // Mixins 
     // @import url('vendor/materialize/components/prefixer'); 
     @import url('vendor/materialize/components/_mixins.scss'); 
     @import url('vendor/materialize/components/_color.scss'); 

     // Variables; 
     @import url('vendor/materialize/components/_variables.scss'); 

     // Reset 
     @import url('vendor/materialize/components/_normalize.scss'); 

     // components 
     @import url('vendor/materialize/components/_global.scss'); 
     @import url('vendor/materialize/components/_badges.scss'); 
     @import url('vendor/materialize/components/_icons-material-design.scss'); 
     @import url('vendor/materialize/components/_grid.scss'); 
     @import url('vendor/materialize/components/_navbar.scss'); 
     @import url('vendor/materialize/components/_roboto.scss'); 
     @import url('vendor/materialize/components/_typography.scss'); 
     @import url('vendor/materialize/components/_transitions.scss'); 
     @import url('vendor/materialize/components/_cards.scss'); 
     @import url('vendor/materialize/components/_toast.scss'); 
     @import url('vendor/materialize/components/_tabs.scss'); 
     @import url('vendor/materialize/components/_tooltip.scss'); 
     @import url('vendor/materialize/components/_buttons.scss'); 
     @import url('vendor/materialize/components/_dropdown.scss'); 
     @import url('vendor/materialize/components/_waves.scss'); 
     @import url('vendor/materialize/components/_modal.scss'); 
     @import url('vendor/materialize/components/_collapsible.scss'); 
     @import url('vendor/materialize/components/_chips.scss'); 
     @import url('vendor/materialize/components/_materialbox.scss'); 
     @import url('vendor/materialize/components/forms/_forms.scss'); 
     @import url('vendor/materialize/components/forms/_input-fields.scss'); 
     @import url('vendor/materialize/components/forms/_radio-buttons.scss'); 
     @import url('vendor/materialize/components/forms/_checkboxes.scss'); 
     @import url('vendor/materialize/components/forms/_switches.scss'); 
     @import url('vendor/materialize/components/forms/_select.scss'); 
     @import url('vendor/materialize/components/forms/_file-input.scss'); 
     @import url('vendor/materialize/components/forms/_range.scss'); 
     @import url('vendor/materialize/components/_table_of_contents.scss'); 
     @import url('vendor/materialize/components/_sideNav.scss'); 
     @import url('vendor/materialize/components/_preloader.scss'); 
     @import url('vendor/materialize/components/_slider.scss'); 
     @import url('vendor/materialize/components/_carousel.scss'); 
     @import url('vendor/materialize/components/_tapTarget.scss'); 
     @import url('vendor/materialize/components/_pulse.scss'); 
     @import url('vendor/materialize/components/date_picker/_default.scss'); 
     @import url('vendor/materialize/components/date_picker/_default.date.scss'); 
     @import url('vendor/materialize/components/date_picker/_default.time.scss');

这允许

$ slate build

正常运行并创建th eme.scss文件包含所有SCSS组件。所以theme.scss似乎被连接并正确上传。不幸的是，似乎有一个整体Shopify的问题上讨论the slate github repo

来源

2017-04-26 18:25:16 zinyosrim

我在看你的问题。你是否按预期工作？我一直在试图自己引导网格添加到我的石板他们

添加引导文件：供应商/引导/ _grid.scss（例如，有一群人）
参考src/styles/theme.scss中的引导资源如下所示：

/================ UTILS ============= ===/ @import url（'tools/mixins.scss'）;

/================设置================/ @import url（'settings/variables .scss.liquid'）;

/================ COMMON ================/ @import URL（'全球/正常化.scss'）; @import url（'global/slate-reset.scss'）; @import url（'global/helper-classes.scss'）; // @ import url（'global/grid-bootstrap.scss'）; @import url（'global/layout.scss'）; @import url（'global/icons.scss'）; @import url（'global/rte.scss'）; @import url（'global/responsive-tables.scss'）; @import url（'global/links-buttons.scss'）; @import url（'global/forms.scss'）; @import url（'global/blank-states.scss'）;

/================ BOOTSTRAP ================/ @import url（'vendor/bootstrap /_格。SCSS'）;

/================ MODULES ================/ @import URL（'模块/位点-header.scss'）; @import URL（ '模块/礼品卡template.scss'）;

确实似乎没有工作，虽然My code editor

在石板主题用于哪些任务管理器。我想我可以调整的任务已经产生了新的样式表和STHG做这样的：

//引导电网 {{ 'grid.scss.css' | asset_url | stylesheet_tag}}

来源

2017-04-28 13:59:19 SandyL

我theme.css串接如预期，但似乎是一个整体的问题，可能与正在上[github上（https://github.com/Shopify/slate/issues大讨论上传的文件/ 133） – zinyosrim

感谢您的链接。我会密切关注它。 – SandyL

将Shopify的主题开发框架Slate与CSS框架相结合Materialise

回答

相关问题