Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Embroider and postcss-import can't find file in node_modules? #612

Closed
NullVoxPopuli opened this issue Jun 6, 2020 · 1 comment · May be fixed by NullVoxPopuli/emberclear#784
Closed

Comments

@NullVoxPopuli
Copy link

NullVoxPopuli commented Jun 6, 2020

I have this import in an addon:

// app/styles/@emberclear/ui.css
@import 'shoelace-css/source/css/normalize';

Which is then imported into the app's css via:

// app/styles/app.css
@import '@emberclear/ui';

I have this error:

Build Error (PostcssCompiler)

Failed to find 'shoelace-css/source/css/normalize'
  in [
    /tmp/broccoli-223309gfVGxcgp0cZh/out-354-broccoli_merge_trees_embroider_v1_app_combined_styles/@emberclear,
        /home/preston/Development/NullVoxpopuli/emberclear/client/web/emberclear/app/styles,
        /home/preston/Development/NullVoxpopuli/emberclear/client/node_modules,
        /home/preston/Development/NullVoxpopuli/emberclear/client/web/addons/ui/addon/styles
  ]
the error dump log
ENV Summary:

  TIME: Sat Jun 06 2020 12:43:50 GMT-0400 (Eastern Daylight Time)
  TITLE: ember
  ARGV:
  - /home/preston/.volta/tools/image/node/14.4.0/6.14.5/bin/node
  - /home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/.bin/ember
  - serve
  - -p
  - 4201
  EXEC_PATH: /home/preston/.volta/tools/image/node/14.4.0/6.14.5/bin/node
  TMPDIR: /tmp
  SHELL: /bin/bash
  PATH:
  - /tmp/yarn--1591461815694-0.32698970513281767
  - /home/preston/Development/NullVoxpopuli/emberclear/client/web/emberclear/node_modules/.bin
  - /home/preston/.config/yarn/link/node_modules/.bin
  - /home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/.bin
  - /home/preston/.volta/tools/image/node/14.4.0/6.14.5/libexec/lib/node_modules/npm/bin/node-gyp-bin
  - /home/preston/.volta/tools/image/node/14.4.0/6.14.5/lib/node_modules/npm/bin/node-gyp-bin
  - /home/preston/.volta/tools/image/node/14.4.0/6.14.5/bin/node_modules/npm/bin/node-gyp-bin
  - /tmp/yarn--1591461815365-0.043525835018702885
  - /home/preston/Development/NullVoxpopuli/emberclear/client/web/emberclear/node_modules/.bin
  - /home/preston/.config/yarn/link/node_modules/.bin
  - /home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/.bin
  - /home/preston/.yarn/bin
  - /home/preston/.volta/tools/image/node/14.4.0/6.14.5/libexec/lib/node_modules/npm/bin/node-gyp-bin
  - /home/preston/.volta/tools/image/node/14.4.0/6.14.5/lib/node_modules/npm/bin/node-gyp-bin
  - /home/preston/.volta/tools/image/node/14.4.0/6.14.5/bin/node_modules/npm/bin/node-gyp-bin
  - /home/preston/.volta/tools/image/node/14.4.0/6.14.5/bin
  - /home/preston/.volta/tools/image/yarn/1.22.4/bin
  - /home/preston/.pythons/Python-3.6.3/bin
  - /home/preston/.cargo/bin
  - /home/preston/Applications
  - /home/preston/apps/phantomjs/bin
  - /home/preston/scripts/system-utils
  - /home/preston/scripts/git
  - /home/preston/scripts/rails
  - /home/preston/scripts
  - /home/preston/.pythons/Python-3.6.3/bin
  - /home/preston/.cargo/bin
  - /home/preston/Applications
  - /home/preston/apps/phantomjs/bin
  - /home/preston/scripts/system-utils
  - /home/preston/scripts/git
  - /home/preston/scripts/rails
  - /home/preston/scripts
  - /usr/local/sbin
  - /usr/local/bin
  - /usr/sbin
  - /usr/bin
  - /sbin
  - /bin
  - /usr/games
  - /usr/local/games
  - /snap/bin
  - /home/preston/.fzf/bin
  PLATFORM: linux x64
  FREEMEM: 2500329472
  TOTALMEM: 20497272832
  UPTIME: 750933
  LOADAVG: 0.42578125,0.275390625,0.29296875
  CPUS:
  - Intel(R) Core(TM) i7-8700 CPU @ 3.20GHz - 3192
  - Intel(R) Core(TM) i7-8700 CPU @ 3.20GHz - 3192
  - Intel(R) Core(TM) i7-8700 CPU @ 3.20GHz - 3192
  - Intel(R) Core(TM) i7-8700 CPU @ 3.20GHz - 3192
  ENDIANNESS: LE
  VERSIONS:
  - ares: 1.16.0
  - brotli: 1.0.7
  - cldr: 37.0
  - icu: 67.1
  - llhttp: 2.0.4
  - modules: 83
  - napi: 6
  - nghttp2: 1.41.0
  - node: 14.4.0
  - openssl: 1.1.1g
  - tz: 2019c
  - unicode: 13.0
  - uv: 1.37.0
  - v8: 8.1.307.31-node.33
  - zlib: 1.2.11

ERROR Summary:

  - broccoliBuilderErrorStack: Error: Failed to find 'shoelace-css/source/css/normalize'
  in [
    /tmp/broccoli-223309gfVGxcgp0cZh/out-354-broccoli_merge_trees_embroider_v1_app_combined_styles/@emberclear,
        /home/preston/Development/NullVoxpopuli/emberclear/client/web/emberclear/app/styles,
        /home/preston/Development/NullVoxpopuli/emberclear/client/node_modules,
        /home/preston/Development/NullVoxpopuli/emberclear/client/web/addons/ui/addon/styles
  ]
    at /home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/postcss-import/lib/resolve-id.js:35:13
    at Function.all (<anonymous>:null:null)

  - code: [undefined]
  - codeFrame: Failed to find 'shoelace-css/source/css/normalize'
  in [
    /tmp/broccoli-223309gfVGxcgp0cZh/out-354-broccoli_merge_trees_embroider_v1_app_combined_styles/@emberclear,
        /home/preston/Development/NullVoxpopuli/emberclear/client/web/emberclear/app/styles,
        /home/preston/Development/NullVoxpopuli/emberclear/client/node_modules,
        /home/preston/Development/NullVoxpopuli/emberclear/client/web/addons/ui/addon/styles
  ]
  - errorMessage: Failed to find 'shoelace-css/source/css/normalize'
  in [
    /tmp/broccoli-223309gfVGxcgp0cZh/out-354-broccoli_merge_trees_embroider_v1_app_combined_styles/@emberclear,
        /home/preston/Development/NullVoxpopuli/emberclear/client/web/emberclear/app/styles,
        /home/preston/Development/NullVoxpopuli/emberclear/client/node_modules,
        /home/preston/Development/NullVoxpopuli/emberclear/client/web/addons/ui/addon/styles
  ]
        at PostcssCompiler
-~- created here: -~-
    at PostcssCompiler.Plugin (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/broccoli-plugin/index.js:7:31)
    at PostcssCompiler.CachingWriter [as constructor] (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/broccoli-caching-writer/index.js:18:10)
    at new PostcssCompiler (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/broccoli-postcss-single/index.js:23:17)
    at /home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli-postcss/index.js:36:12
    at Array.map (<anonymous>:null:null)
    at PostcssPlugin.toTree (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli-postcss/index.js:33:36)
    at /home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli-preprocess-registry/preprocessors.js:188:26
    at Array.forEach (<anonymous>:null:null)
    at processPlugins (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli-preprocess-registry/preprocessors.js:186:11)
    at Object.module.exports.preprocessCss (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli-preprocess-registry/preprocessors.js:156:10)
    at V1App.synthesizeStylesPackage (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/@embroider/compat/src/v1-app.js:389:41)
    at CompatAddons.getSyntheticPackages (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/@embroider/compat/src/compat-addons.js:169:32)
    at CompatAddons.get tree [as tree] (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/@embroider/compat/src/compat-addons.js:46:49)
    at CompatApp.augment (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/@embroider/core/src/build-stage.js:57:64)
    at CompatApp.get tree (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/@embroider/core/src/build-stage.js:26:50)
    at CompatApp.<anonymous> (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/typescript-memoize/dist/memoize-decorator.js:67:52)
    at new PackagerRunner (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/@embroider/core/src/to-broccoli-plugin.js:10:26)
    at defaultPipeline (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/@embroider/compat/src/default-pipeline.js:36:12)
    at module.exports (/home/preston/Development/NullVoxpopuli/emberclear/client/web/emberclear/ember-cli-build.js:118:12)
    at Builder.readBuildFile (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli/lib/models/builder.js:49:14)
    at Builder.setupBroccoliBuilder (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli/lib/models/builder.js:63:22)
    at new Builder (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli/lib/models/builder.js:29:10)
    at ServeTask.run (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli/lib/tasks/serve.js:49:7)
    at /home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli/lib/models/command.js:238:24
    at processTicksAndRejections (internal/process/task_queues.js:97:5)

-~- (end) -~-
  - errorType: Build Error
  - location:
    - column: [undefined]
    - file: [undefined]
    - line: [undefined]
    - treeDir: [undefined]
  - message: Failed to find 'shoelace-css/source/css/normalize'
  in [
    /tmp/broccoli-223309gfVGxcgp0cZh/out-354-broccoli_merge_trees_embroider_v1_app_combined_styles/@emberclear,
        /home/preston/Development/NullVoxpopuli/emberclear/client/web/emberclear/app/styles,
        /home/preston/Development/NullVoxpopuli/emberclear/client/node_modules,
        /home/preston/Development/NullVoxpopuli/emberclear/client/web/addons/ui/addon/styles
  ]
        at PostcssCompiler
-~- created here: -~-
    at PostcssCompiler.Plugin (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/broccoli-plugin/index.js:7:31)
    at PostcssCompiler.CachingWriter [as constructor] (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/broccoli-caching-writer/index.js:18:10)
    at new PostcssCompiler (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/broccoli-postcss-single/index.js:23:17)
    at /home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli-postcss/index.js:36:12
    at Array.map (<anonymous>:null:null)
    at PostcssPlugin.toTree (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli-postcss/index.js:33:36)
    at /home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli-preprocess-registry/preprocessors.js:188:26
    at Array.forEach (<anonymous>:null:null)
    at processPlugins (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli-preprocess-registry/preprocessors.js:186:11)
    at Object.module.exports.preprocessCss (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli-preprocess-registry/preprocessors.js:156:10)
    at V1App.synthesizeStylesPackage (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/@embroider/compat/src/v1-app.js:389:41)
    at CompatAddons.getSyntheticPackages (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/@embroider/compat/src/compat-addons.js:169:32)
    at CompatAddons.get tree [as tree] (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/@embroider/compat/src/compat-addons.js:46:49)
    at CompatApp.augment (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/@embroider/core/src/build-stage.js:57:64)
    at CompatApp.get tree (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/@embroider/core/src/build-stage.js:26:50)
    at CompatApp.<anonymous> (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/typescript-memoize/dist/memoize-decorator.js:67:52)
    at new PackagerRunner (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/@embroider/core/src/to-broccoli-plugin.js:10:26)
    at defaultPipeline (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/@embroider/compat/src/default-pipeline.js:36:12)
    at module.exports (/home/preston/Development/NullVoxpopuli/emberclear/client/web/emberclear/ember-cli-build.js:118:12)
    at Builder.readBuildFile (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli/lib/models/builder.js:49:14)
    at Builder.setupBroccoliBuilder (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli/lib/models/builder.js:63:22)
    at new Builder (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli/lib/models/builder.js:29:10)
    at ServeTask.run (/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli/lib/tasks/serve.js:49:7)
    at /home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/ember-cli/lib/models/command.js:238:24
    at processTicksAndRejections (internal/process/task_queues.js:97:5)

-~- (end) -~-
  - name: Error
  - nodeAnnotation: [undefined]
  - nodeName: PostcssCompiler
  - originalErrorMessage: Failed to find 'shoelace-css/source/css/normalize'
  in [
    /tmp/broccoli-223309gfVGxcgp0cZh/out-354-broccoli_merge_trees_embroider_v1_app_combined_styles/@emberclear,
        /home/preston/Development/NullVoxpopuli/emberclear/client/web/emberclear/app/styles,
        /home/preston/Development/NullVoxpopuli/emberclear/client/node_modules,
        /home/preston/Development/NullVoxpopuli/emberclear/client/web/addons/ui/addon/styles
  ]
  - stack: Error: Failed to find 'shoelace-css/source/css/normalize'
  in [
    /tmp/broccoli-223309gfVGxcgp0cZh/out-354-broccoli_merge_trees_embroider_v1_app_combined_styles/@emberclear,
        /home/preston/Development/NullVoxpopuli/emberclear/client/web/emberclear/app/styles,
        /home/preston/Development/NullVoxpopuli/emberclear/client/node_modules,
        /home/preston/Development/NullVoxpopuli/emberclear/client/web/addons/ui/addon/styles
  ]
    at /home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/postcss-import/lib/resolve-id.js:35:13
    at Function.all (<anonymous>:null:null)


This is how I'm configuring my addon

Addon's index.js
// located at:
// <reporoot>/...
// emberclear/client/web/addons/ui/index.js
'use strict';

const path = require('path');

const PostCSSImport = require('postcss-import');
const PostCSSNext = require('postcss-cssnext');

const nodeModules = path.join(__dirname, '..', '..', '..', 'node_modules');
const addonStyles = path.join(__dirname, 'addon', 'styles');

const importConfig = PostCSSImport({
  path: ['app/styles/', nodeModules + '/', addonStyles + '/'],
});

const cssNextConfig = PostCSSNext({
  features: {
    colorFunction: {
      preserveCustomProps: false,
    },
    customProperties: {
      preserve: true,
    },
    rem: false,
  },
});

module.exports = {
  name: require('./package').name,

  // override
  isDevelopingAddon() {
    return true;
  },

  options: {
    /**
     * The addon needs to support PostCSS, but not actually compile any of it.
     *
     * This is so that the consuming app can use all the same features.
     */
    postcssOptions: {
      compile: {
        plugins: [importConfig, cssNextConfig],
      },
    },
  },

  included: function (app) {
    this._super.included.apply(this, arguments);

    app.options = app.options || {};
    app.options.postcssOptions = {
      compile: {
        plugins: [importConfig, cssNextConfig],
      },
    };
  },
};

I confirm the files exist though

$ ls $PWD/node_modules/shoelace-css/source/css/
alerts.css   content.css    file-buttons.css  _homepage.css  progress-bars.css  tables.css     variables.css
badges.css   _docs.css      forms.css         loaders.css    shoelace.css       tabs.css
buttons.css  dropdowns.css  grid.css          normalize.css  switches.css       utilities.css

$ echo $PWD/node_modules/shoelace-css/source/css/
/home/preston/Development/NullVoxpopuli/emberclear/client/web/node_modules/shoelace-css/source/css/

cc @ef4 - idk if you've encountered this before, or if I'm doing something stupid 🤷 ?

@NullVoxPopuli
Copy link
Author

NullVoxPopuli commented Jun 6, 2020

omg. I had an extra .. in my node_modules path.

const nodeModules = path.join(__dirname, '..', '..', '..', 'node_modules');
// should be
const nodeModules = path.join(__dirname, '..', '..', 'node_modules');

so.... I don't know how this is working without embroider now....

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant