Moving to a more stable way of compiling the styles #333

webark · 2019-09-21T18:11:35Z

Breaking changes in this approach:

styleNamespace in addon components needs to be explicitly added al la

import Component from '@ember/component';

import layout from './template';
import { styleNamespace } from './styles.css';

export default Component.extend({
  classNameBindings: ['styleNamespace'],
  styleNamespace,
  layout,
});

pod-styles has been replaced with ember-styles
"classic" layout is not currently supported.
there is no more podNames that can be imported from ember-component-css/pod-names
do not support prior to ember 3.6
do not support below node 10

index.js

rather then generating a single `pod-names.js` file with all of the namespaced styles, moving to a mechanism where each style file set (style files that are shared the same namespace at the same depth) gets it's own `style-info.js` file that has the namespacing for that component. For components with a `component.js` file, using a babel plugin to import the `style-info.js` and add the styleNamespace as a class property, as well as adding it to the classNameBindings. For routing styles, using a lookup pattern where we are looking up the given namespace through the owner lookup. For components without a component.js, creating a base one that defines the import and sets the class with the layout. For template-only-glimmer-components, wrapping the contents of the template in a `let` block that defines the `styleNamespace`. * moving environment.js 'ember-component-css' config values to emberCliStyles values that are set in the ember-cli-build.js file. * Also deprecating the `pod-styles` name for the imported style file in favor of an `ember-styles` named file. * Also migrating things to their latest versions as well and moving things to proper classes. * Also using preprocessor registries rather then the `treeFor` hooks. * Also migrated the tests to use the latest modules and hooks. Setup some base acceptance tests that the different style types share.

in something like `import { foo as bar } from 'fee';` `foo` is the imported part, while `bar` is the local. we just want the local this enables one to import other `styleNamespaces` and use them in the component.

…rrectly

… building of routes, it should just recive an array

… a route for a cleaner and more predictable api

… methods

… individual work

…e-manifest and broccoli-tree-walker

…needed, and pollished up some names

…k in as we go

… when you remove, and I couldn't figure out how to get it back in a good state

…o latest versions

…amespace' in templates

… extentions

…helper. This can be used anywhere, but is needed for template only components

webark · 2020-07-25T22:42:07Z

ok. an "alpha" tag has been published with the version of 1.0.0-alpha.2

https://www.npmjs.com/package/ember-component-css/v/1.0.0-alpha.2

WIll create a new issue with the remaining work to get to a stable 1.0 version soon.

webark force-pushed the registry-way branch from 57ab46e to 8166fb9 Compare September 21, 2019 21:37

webark mentioned this pull request Jul 23, 2020

Support colocated components #343

Open

RobbieTheWagner reviewed Jul 25, 2020

View reviewed changes

index.js Show resolved Hide resolved

webark changed the base branch from master to beta July 25, 2020 22:30

webark added 26 commits July 25, 2020 15:33

fix: using local rather then imported so access the actual variable

5bf2bab

in something like `import { foo as bar } from 'fee';` `foo` is the imported part, while `bar` is the local. we just want the local this enables one to import other `styleNamespaces` and use them in the component.

fix: sometimes .trees['app'] is a string, and sometimes a node.

69082eb

fix(template only components): checking the templates only feature co…

ea728d7

…rrectly

chore(upgrade): upgraded ember and packages to latset version

8243c31

refactor(deprication): updated to handle the ember routeing service

55a07d4

chore(upgrade): updated yarn.lock to latest versions

9521d31

refactor(babel plugin): moving away from augmenting individuals js files

cb50b87

chore(upgrade): upgraded to latest packages

2bb7745

fix(nested routes): handledling nested route style names appropriatly

4383926

chore(upgrade): upgraded packages to the latest version

09832f2

refactor(route processing): the utility should not need to hanlde the…

78c2810

… building of routes, it should just recive an array

refactor(route processing): switched to useing the public 'parent' of…

c53d947

… a route for a cleaner and more predictable api

refactor: cleanup and and refactored some of the walker and compiling…

426bf01

… methods

test: skipping tests for now to be picked up later

f8adb27

chore: upgardded all packages

119e4bb

refactor: split up into sequential preprocessors with each doing it's…

1ac8dcf

… individual work

refactor: upgraded to latest pagakcges and now using new broccoli-fil…

6ca9680

…e-manifest and broccoli-tree-walker

chore(cleanup): reomoving some files that where missed in the rebase

dfd1a73

refactor(cleanup): cleaned up some old packages that hwere no longer …

2f6424b

…needed, and pollished up some names

test(update): updating tests to work with latest after rebase

ec62fb2

chore(upgrade): upgraded to latest packages

56ded89

chore(node version): needs at least a node version of 10

269e84f

test(version compbatibitiy): pushing to what it is now, can reign bac…

0f19eea

…k in as we go

test(travis): adding in a extra scenario cause travis doesn't like it…

6465fde

… when you remove, and I couldn't figure out how to get it back in a good state

test(travis config): had syntax error that was leading to an empty build

4962649

webark added 7 commits July 25, 2020 15:33

chore(upgrade packages): upgraded packages to latest versions

712686c

refactor(overhaul): complete overhaul over all aspects and upgrades t…

6331feb

…o latest versions

feat(style-namepace): switched to using a helper for the raw 'style-n…

c7137cc

…amespace' in templates

feat(style registry): registering style types based off of style file…

49b6fd3

… extentions

feat(co location): added tests and modifications for co location

a87dd7f

feat(namespace modifier): moving to an element modifer rather then a …

c185043

…helper. This can be used anywhere, but is needed for template only components

fix(lint): removed an extraneous semi colon

64c0ae8

webark force-pushed the registry-way branch from fcebbfd to 64c0ae8 Compare July 25, 2020 22:34

webark merged commit 2a2981e into beta Jul 25, 2020

webark deleted the registry-way branch July 25, 2020 22:42

webark mentioned this pull request Aug 6, 2020

Doesn't work in Octane (3.15) glimmer component #342

Open

webark mentioned this pull request Jun 9, 2021

Incompatible with embroider #355

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Moving to a more stable way of compiling the styles #333

Moving to a more stable way of compiling the styles #333

Uh oh!

webark commented Sep 21, 2019 •

edited

Loading

Uh oh!

Uh oh!

webark commented Jul 25, 2020

Uh oh!

Uh oh!

Moving to a more stable way of compiling the styles #333

Moving to a more stable way of compiling the styles #333

Uh oh!

Conversation

webark commented Sep 21, 2019 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

webark commented Jul 25, 2020

Uh oh!

Uh oh!

webark commented Sep 21, 2019 •

edited

Loading