Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 2 additions & 16 deletions packages/ember-css-modules/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@
const path = require('path');
const fs = require('fs');
const debug = require('debug')('ember-css-modules:addon');
const VersionChecker = require('ember-cli-version-checker');

const HtmlbarsPlugin = require('./lib/htmlbars-plugin');
const ModulesPreprocessor = require('./lib/modules-preprocessor');
Expand All @@ -19,7 +18,6 @@ module.exports = {
this.outputStylesPreprocessor = new OutputStylesPreprocessor({
owner: this,
});
this.checker = new VersionChecker(this.project);
this.plugins = new PluginRegistry(this.parent);
},

Expand Down Expand Up @@ -66,11 +64,8 @@ module.exports = {
this.parentPreprocessorRegistry.add(
'htmlbars-ast-plugin',
HtmlbarsPlugin.instantiate({
emberVersion: this.checker.for('ember-source').version,
options: {
fileExtension: this.getFileExtension(),
includeExtensionInModulePath: this.includeExtensionInModulePath(),
},
fileExtension: this.getFileExtension(),
includeExtensionInModulePath: this.includeExtensionInModulePath(),
})
);
},
Expand Down Expand Up @@ -169,15 +164,6 @@ module.exports = {
return this.cssModulesOptions.postcssOptions;
},

getAddonModulesRoot() {
// CLI 2.12 stopped exposing addon stuff nested under `modules/`
if (this.checker.for('ember-cli', 'npm').satisfies('< 2.12')) {
return 'modules/';
} else {
return '';
}
},

getParentAddonTree() {
return path.join(this.parentAddon.root, this.parentAddon.treePaths.addon);
},
Expand Down
66 changes: 8 additions & 58 deletions packages/ember-css-modules/lib/htmlbars-plugin/index.js
Original file line number Diff line number Diff line change
@@ -1,31 +1,24 @@
'use strict';

const utils = require('./utils');
const semver = require('semver');

module.exports = class ClassTransformPlugin {
constructor(env, options) {
this.syntax = env.syntax;
this.builders = env.syntax.builders;
this.options = options;
this.stylesModule = this.determineStylesModule(env);
this.isGlimmer = this.detectGlimmer();
this.visitor = this.buildVisitor(env);

// Alias for 2.15 <= Ember < 3.1
this.visitors = this.visitor;
}

static instantiate({ emberVersion, options }) {
static instantiate(options) {
return {
name: 'ember-css-modules',
plugin: semver.lt(emberVersion, '2.15.0-alpha')
? LegacyAdapter.bind(null, this, options)
: (env) => new this(env, options),
plugin: (env) => new this(env, options),
parallelBabel: {
requireFile: __filename,
buildUsing: 'instantiate',
params: { emberVersion, options },
params: options,
},
baseDir() {
return `${__dirname}/../..`;
Expand Down Expand Up @@ -54,17 +47,6 @@ module.exports = class ClassTransformPlugin {
return name;
}

detectGlimmer() {
if (!this.syntax.parse) {
return false;
}

// HTMLBars builds ConcatStatements with StringLiterals + raw PathExpressions
// Glimmer builds ConcatStatements with TextNodes + MustacheStatements
let ast = this.syntax.parse('<div class="foo {{bar}}"></div>');
return ast.body[0].attributes[0].value.parts[0].type === 'TextNode';
}

buildVisitor(env) {
if (env.moduleName === env.filename) {
// No-op for the stage 1 Embroider pass (which only contains relative paths)
Expand Down Expand Up @@ -133,7 +115,6 @@ module.exports = class ClassTransformPlugin {

utils.removeAttr(node, localClassAttr);

let stringBuilder = this.isGlimmer ? 'text' : 'string';
let classAttr = utils.getAttr(node, 'class');
let parts = [];
let classAttrValue;
Expand All @@ -149,26 +130,18 @@ module.exports = class ClassTransformPlugin {
parts.push(
this.builders.mustache(
this.builders.path('concat'),
utils.concatStatementToParams(
this.builders,
classAttrValue,
this.isGlimmer
)
utils.concatStatementToParams(this.builders, classAttrValue)
)
);
} else if (classAttrValue.type === 'TextNode') {
parts.push(this.builders[stringBuilder](classAttrValue.chars));
parts.push(this.builders.text(classAttrValue.chars));
} else if (classAttrValue.type === 'MustacheStatement') {
if (classAttrValue.params.length || this.isGlimmer) {
parts.push(classAttrValue);
} else {
parts.push(this.builders.path(classAttrValue.path.original));
}
parts.push(classAttrValue);
}
}

utils.pushAll(parts, this.localToPath(localClassAttr.value));
this.divide(parts, this.isGlimmer ? 'text' : 'string');
this.divide(parts, 'text');
node.attributes.unshift(
this.builders.attr('class', this.builders.concat(parts))
);
Expand Down Expand Up @@ -225,11 +198,7 @@ module.exports = class ClassTransformPlugin {

concatLocalPath(node) {
let concatPath = this.builders.path('concat');
let concatParts = utils.concatStatementToParams(
this.builders,
node,
this.isGlimmer
);
let concatParts = utils.concatStatementToParams(this.builders, node);
let concatStatement = this.builders.mustache(concatPath, concatParts);
return this.dynamicLocalPath(concatStatement);
}
Expand Down Expand Up @@ -268,22 +237,3 @@ module.exports = class ClassTransformPlugin {
return parts;
}
};

// For Ember < 2.15
class LegacyAdapter {
constructor(plugin, options, env) {
this.plugin = plugin;
this.options = options;
this.meta = env.meta;
this.syntax = null;
}

transform(ast) {
let plugin = new this.plugin(
Object.assign({ syntax: this.syntax }, this.meta),
this.options
);
this.syntax.traverse(ast, plugin.visitor);
return ast;
}
}
6 changes: 1 addition & 5 deletions packages/ember-css-modules/lib/htmlbars-plugin/utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -44,11 +44,7 @@ function textToString(builders, node) {
}
}

function concatStatementToParams(builders, node, isGlimmer) {
if (!isGlimmer) {
return node.parts;
}

function concatStatementToParams(builders, node) {
return node.parts.map(function (part) {
if (part.type === 'MustacheStatement') {
if (!part.params.length && !part.hash.pairs.length) {
Expand Down
18 changes: 0 additions & 18 deletions packages/ember-css-modules/lib/make-postcss-plugin.js

This file was deleted.

28 changes: 10 additions & 18 deletions packages/ember-css-modules/lib/modules-preprocessor.js
Original file line number Diff line number Diff line change
Expand Up @@ -50,15 +50,6 @@ module.exports = class ModulesPreprocessor {
let inputRoot = this.owner.belongsToAddon()
? this.owner.getParentAddonTree()
: this.owner.app.trees.app;
let outputRoot = this.owner.belongsToAddon()
? this.owner.getAddonModulesRoot()
: '';

if (outputRoot) {
inputRoot = new Funnel(inputRoot, {
destDir: outputRoot,
});
}

// If moduleName is defined, that should override the parent's name.
// Otherwise, the template and generated module will disagree as to what the path should be.
Expand All @@ -71,17 +62,14 @@ module.exports = class ModulesPreprocessor {

let modulesSources = new ModuleSourceFunnel(inputRoot, modulesInput, {
include: ['**/*.' + this.owner.getFileExtension()],
outputRoot,
parentName: ownerName,
});

let modulesTree = new (require('broccoli-css-modules'))(modulesSources, {
extension: this.owner.getFileExtension(),
plugins: this.getPostcssPlugins(),
enableSourceMaps: this.owner.enableSourceMaps(),
sourceMapBaseDir: this.owner.belongsToAddon()
? this.owner.getAddonModulesRoot()
: '',
sourceMapBaseDir: '',
postcssOptions: this.owner.getPostcssOptions(),
virtualModules: this.owner.getVirtualModules(),
generateScopedName: this.scopedNameGenerator(),
Expand Down Expand Up @@ -199,9 +187,15 @@ module.exports = class ModulesPreprocessor {
}

rootPathPlugin() {
return require('./make-postcss-plugin')('root-path-tag', () => (css) => {
css.source.input.rootPath = this._modulesTree.inputPaths[0];
});
return Object.assign(
() => ({
postcssPlugin: 'root-path-tag',
Once: (css) => {
css.source.input.rootPath = this._modulesTree.inputPaths[0];
},
}),
{ postcss: true }
);
}

resolvePath(importPath, fromFile) {
Expand All @@ -211,7 +205,6 @@ module.exports = class ModulesPreprocessor {
defaultExtension: this.owner.getFileExtension(),
ownerName: this._ownerName,
parentName: this._parentName,
addonModulesRoot: this.owner.getAddonModulesRoot(),
root: ensurePosixPath(this._modulesTree.inputPaths[0]),
parent: this.owner.getParent(),
ui: this.owner.ui,
Expand All @@ -230,7 +223,6 @@ class ModuleSourceFunnel extends Funnel {
constructor(input, stylesTree, options) {
super([input, stylesTree], options);
this.parentName = options.parentName;
this.destDir = options.outputRoot;
this.inputHasParentName = null;
}

Expand Down
2 changes: 1 addition & 1 deletion packages/ember-css-modules/lib/resolve-path.js
Original file line number Diff line number Diff line change
Expand Up @@ -103,7 +103,7 @@ function resolveExternalPath(importPath, originalPath, fromFile, options) {
let absolutePath = ensurePosixPath(
path.resolve(addonTreePath, pathWithinAddon)
);
let keyPath = options.addonModulesRoot + addonName + '/' + pathWithinAddon;
let keyPath = addonName + '/' + pathWithinAddon;
return new DependencyPath('external', absolutePath, keyPath);
}

Expand Down
2 changes: 0 additions & 2 deletions packages/ember-css-modules/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -81,12 +81,10 @@
"debug": "^4.3.2",
"ember-cli-babel": "^7.26.6",
"ember-cli-htmlbars": "^6.0.0",
"ember-cli-version-checker": "^5.1.2",
"ensure-posix-path": "^1.0.2",
"hash-string": "^1.0.0",
"lodash.merge": "^4.6.1",
"postcss": "^8.0.0",
"semver": "^7.3.5",
"toposort": "^2.0.2"
},
"ember": {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
/* global require, define */

import Ember from 'ember';
import { VERSION } from '@ember/version';
import ClassTransformPlugin from 'ecm-template-transform';

const { compile } = Ember.__loader.require('ember-template-compiler');
Expand All @@ -22,10 +21,7 @@ export default function registerStyles(styles) {
}

const { plugin } = ClassTransformPlugin.instantiate({
emberVersion: VERSION,
options: {
includeExtensionInModulePath: false,
},
includeExtensionInModulePath: false,
});

const plugins = { ast: [plugin] };
Expand Down