diff --git a/packages/bazel/src/schematics/bazel-workspace/files/WORKSPACE.template b/packages/bazel/src/schematics/bazel-workspace/files/WORKSPACE.template index cf4cf08a06..1339ade74f 100644 --- a/packages/bazel/src/schematics/bazel-workspace/files/WORKSPACE.template +++ b/packages/bazel/src/schematics/bazel-workspace/files/WORKSPACE.template @@ -41,7 +41,7 @@ http_archive( url = "https://registry.yarnpkg.com/rxjs/-/rxjs-%s.tgz" % RXJS_VERSION, strip_prefix = "package/src", ) - +<% if (sass) { %> # Rules for compiling sass RULES_SASS_VERSION = "<%= RULES_SASS_VERSION %>" http_archive( @@ -49,7 +49,7 @@ http_archive( url = "https://github.com/bazelbuild/rules_sass/archive/%s.zip" % RULES_SASS_VERSION, strip_prefix = "rules_sass-%s" % RULES_SASS_VERSION, ) - +<% } %> #################################### # Load and install our dependencies downloaded above. @@ -85,9 +85,9 @@ browser_repositories( load("@build_bazel_rules_typescript//:defs.bzl", "ts_setup_workspace") ts_setup_workspace() - +<% if (sass) { %> load("@io_bazel_rules_sass//sass:sass_repositories.bzl", "sass_repositories") sass_repositories() - +<% } %> load("@angular//:index.bzl", "ng_setup_workspace") ng_setup_workspace() diff --git a/packages/bazel/src/schematics/bazel-workspace/files/src/BUILD.bazel.template b/packages/bazel/src/schematics/bazel-workspace/files/src/BUILD.bazel.template index 4f01dafe18..fe97e51f4a 100644 --- a/packages/bazel/src/schematics/bazel-workspace/files/src/BUILD.bazel.template +++ b/packages/bazel/src/schematics/bazel-workspace/files/src/BUILD.bazel.template @@ -5,7 +5,17 @@ load("@build_bazel_rules_typescript//:defs.bzl", "ts_library", "ts_web_test_suit load("@build_bazel_rules_nodejs//:defs.bzl", "rollup_bundle", "history_server") load("@build_bazel_rules_nodejs//internal/web_package:web_package.bzl", "web_package") load("@build_bazel_rules_typescript//:defs.bzl", "ts_devserver") +<% if (sass) { %>load("@io_bazel_rules_sass//:defs.bzl", "sass_binary") +[ +sass_binary( + name = "style_" + x, + src = x, + deps = [], +) +for x in glob(["**/*.scss"]) +] +<% } %> ng_module( name = "src", srcs = glob( @@ -20,7 +30,7 @@ ng_module( assets = glob([ "**/*.css", "**/*.html", - ]), + ])<% if (sass) { %> + [":style_" + x for x in glob(["**/*.scss"])]<% } %>, deps = [ "@angular//packages/core", "@angular//packages/platform-browser",<% if (routing) { %> diff --git a/packages/bazel/src/schematics/bazel-workspace/index.ts b/packages/bazel/src/schematics/bazel-workspace/index.ts index db4b97650a..b96d3ef30c 100644 --- a/packages/bazel/src/schematics/bazel-workspace/index.ts +++ b/packages/bazel/src/schematics/bazel-workspace/index.ts @@ -60,6 +60,16 @@ function hasRoutingModule(host: Tree) { return hasRouting; } +/** + * Returns true if project uses SASS stylesheets, false otherwise. + */ +function hasSassStylesheet(host: Tree) { + let hasSass = false; + // The proper extension for SASS is .scss + host.visit((file: string) => { hasSass = hasSass || file.endsWith('.scss'); }); + return hasSass; +} + export default function(options: BazelWorkspaceOptions): Rule { return (host: Tree, context: SchematicContext) => { if (!options.name) { @@ -103,6 +113,7 @@ export default function(options: BazelWorkspaceOptions): Rule { ...options, 'dot': '.', ...workspaceVersions, routing: hasRoutingModule(host), + sass: hasSassStylesheet(host), }), move(appDir), ])); diff --git a/packages/bazel/src/schematics/bazel-workspace/index_spec.ts b/packages/bazel/src/schematics/bazel-workspace/index_spec.ts index 2963cdcbd8..23cacf0e6e 100644 --- a/packages/bazel/src/schematics/bazel-workspace/index_spec.ts +++ b/packages/bazel/src/schematics/bazel-workspace/index_spec.ts @@ -12,7 +12,7 @@ import {clean} from './index'; describe('Bazel-workspace Schematic', () => { const schematicRunner = - new SchematicTestRunner('@angular/bazel', require.resolve('../collection.json'), ); + new SchematicTestRunner('@angular/bazel', require.resolve('../collection.json')); const defaultOptions = { name: 'demo', }; @@ -79,6 +79,46 @@ describe('Bazel-workspace Schematic', () => { expect(content).toContain('workspace(name = "demo_project"'); }); }); + + describe('SASS', () => { + let host = new UnitTestTree(new HostTree); + beforeAll(() => { + host.create('/demo/src/app/app.component.scss', ''); + expect(host.files).toContain('/demo/src/app/app.component.scss'); + const options = {...defaultOptions}; + host = schematicRunner.runSchematic('bazel-workspace', options, host); + expect(host.files).toContain('/demo/WORKSPACE'); + expect(host.files).toContain('/demo/src/BUILD.bazel'); + }); + + it('should download rules_sass in WORKSPACE', () => { + const content = host.readContent('/demo/WORKSPACE'); + expect(content).toContain('RULES_SASS_VERSION'); + expect(content).toContain('io_bazel_rules_sass'); + }); + + it('should load sass_repositories in WORKSPACE', () => { + const content = host.readContent('/demo/WORKSPACE'); + expect(content).toContain( + 'load("@io_bazel_rules_sass//sass:sass_repositories.bzl", "sass_repositories")'); + expect(content).toContain('sass_repositories()'); + }); + + it('should add sass_binary rules in src/BUILD', () => { + const content = host.readContent('/demo/src/BUILD.bazel'); + expect(content).toContain('load("@io_bazel_rules_sass//:defs.bzl", "sass_binary")'); + expect(content).toMatch(/sass_binary\((.*\n)+\)/); + }); + + it('should add SASS targets to assets of ng_module in src/BUILD', () => { + const content = host.readContent('/demo/src/BUILD.bazel'); + expect(content).toContain(` + assets = glob([ + "**/*.css", + "**/*.html", + ]) + [":style_" + x for x in glob(["**/*.scss"])],`); + }); + }); }); describe('clean', () => {