Uploaded image for project: 'PUBLIC - Liferay Portal Community Edition'
  1. PUBLIC - Liferay Portal Community Edition
  2. LPS-124393

As a developer I would like to have a SCSS/SASS example

    Details

    • Type: Feature Request
    • Status: Open
    • Priority: Minor
    • Resolution: Unresolved
    • Affects Version/s: None
    • Fix Version/s: None
    • Component/s: Documentation
    • Labels:
      None

      Description

      Hello I saw the ticket for the custom workflow support got solved:

      https://github.com/liferay/generator-liferay-fragments/issues/19

      I'm waiting for this feature for a long time and want to use it mainly for the purpose of use SCSS. I tried to make it work with like the following configuration:

      let initialConfig = require('generator-liferay-fragments').getBundlerConfig()
      
      sassLoader = {
        exclude: /node_modules/,
        test: /\.scss$/,
        use: ['sass-loader'],
      }
      
      let finalConfig = initialConfig.webpack.module.rules.push(sassLoader)
      module.exports = finalConfig
      

      Sadly I got some errors and it's a black box for me how to solve it properly that my SCSS-files get parsed into CSS files and what I need to configure that it works.

      C:\DEV\source\clavisIT\clavis-public-workspace\modules\sample-liferay-fragments\node_modules\@liferay\js-toolkit-core\lib\file\FilePath.js:14
                  nativePath = nativePath.replace(/\//g, '\\');
                                          ^TypeError: nativePath.replace is not a function
          at new FilePath (C:\DEV\source\clavisIT\clavis-public-workspace\modules\sample-liferay-fragments\node_modules\@liferay\js-toolkit-core\lib\file\FilePath.js:14:37)
          at Object.getFeaturesFilePath (C:\DEV\source\clavisIT\clavis-public-workspace\modules\sample-liferay-fragments\node_modules\@liferay\js-toolkit-core\lib\project\getFeaturesFilePath.js:25:32)
          at new Localization (C:\DEV\source\clavisIT\clavis-public-workspace\modules\sample-liferay-fragments\node_modules\@liferay\js-toolkit-core\lib\project\Localization.js:23:45)
          at Project.loadFrom (C:\DEV\source\clavisIT\clavis-public-workspace\modules\sample-liferay-fragments\node_modules\@liferay\js-toolkit-core\lib\project\Project.js:270:21)
          at new Project (C:\DEV\source\clavisIT\clavis-public-workspace\modules\sample-liferay-fragments\node_modules\@liferay\js-toolkit-core\lib\project\Project.js:32:14)
          at Object.<anonymous> (C:\DEV\source\clavisIT\clavis-public-workspace\modules\sample-liferay-fragments\node_modules\@liferay\js-toolkit-core\lib\bundler\PkgDesc.js:14:17)
          at Module._compile (internal/modules/cjs/loader.js:1085:30)
          at Object.Module._extensions..js (internal/modules/cjs/loader.js:1114:10)
          at Module.load (internal/modules/cjs/loader.js:950:32)
          at Function.Module._load (internal/modules/cjs/loader.js:791:14)
          at makeError (C:\DEV\source\clavisIT\clavis-public-workspace\modules\sample-liferay-fragments\node_modules\execa\lib\error.js:59:11)
          at handlePromise (C:\DEV\source\clavisIT\clavis-public-workspace\modules\sample-liferay-fragments\node_modules\execa\index.js:114:26)
          at processTicksAndRejections (internal/process/task_queues.js:93:5)
          at async Object.exports.buildProjectContent (C:\DEV\source\clavisIT\clavis-public-workspace\modules\sample-liferay-fragments\node_modules\generator-liferay-fragments\generators\utils\project-content\build-proj
      ect-content.js:23:9)
          at async default_1.asking (C:\DEV\source\clavisIT\clavis-public-workspace\modules\sample-liferay-fragments\node_modules\generator-liferay-fragments\generators\import\index.js:60:41)
      npm ERR! code ELIFECYCLE
      npm ERR! errno 1
      npm ERR! sample-liferay-fragments@1.0.0 import: `yo liferay-fragments:import`
      npm ERR! Exit status 1
      npm ERR!
      npm ERR! Failed at the sample-liferay-fragments@1.0.0 import script.
      npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
      

      An example would be very helpful with some tests in the repository. 

        Attachments

          Activity

            People

            Assignee:
            support-lep@liferay.com SE Support
            Reporter:
            marco.endres Marco Endres
            Votes:
            1 Vote for this issue
            Watchers:
            1 Start watching this issue

              Dates

              Created:
              Updated:

                Packages

                Version Package