https://netsuiteprofessionals.com logo
Join Slack
Powered by
Hi, Anyone experiencing any issues when trying to ...
# suitecommerce
g
Hi, Anyone experiencing any issues when trying to activate a domain in Release preview? We are trying to test our SCA website ahead of the new release, our activation receives an error caused by the SASS compiler. I have tried it with our custom theme as well as the base theme for SCA, but the same error is showing.
s
Is your theme compatible with Dart Sass? We’re changing the Sass compiler in 24.1 and some declarations will be invalid
g
We are using a custom theme based off 2020 SuiteCommerce Base Theme. Is there a patch we can implement to make it compatible? My case has been assigned to an existing defect #754212.
s
Ah that issue, that’s a JavaScript issue. What’s the error you’re getting?
g
Copy code
{
  "type": "error.SuiteScriptError",
  "name": "225949",
  "message": "Compiler was unable to compile the given input file.",
  "id": null,
  "stack": [
    "createError(N/error)"
  ],
  "cause": {
    "message": "Compiler was unable to compile the given input file.",
    "stack": [
      "createError(N/error)",
      "map(/SuiteBundles/Bundle 500777/ExtensionMechanism.Server/CompilersMapReduce/SassCompilerMapReduce.js:160)"
    ],
    "name": "225949",
    "data": {
      "response": null,
      "notifications": [
        {
          "message": "Compilation error occured.",
          "status": "1",
          "json": "compound selectors may no longer be extended.\nConsider `@extend .button-secondary, :hover` instead.\nSee <https://sass-lang.com/d/extend-compound> for details.\n",
          "file": "filecabinet:/SuiteScripts/Deploy_Extensions/Maddocks/Maddocks@1.0.7/Modules/BaseSassStyles/Sass/atoms/_buttons.scss 325:11 @import\nfilecabinet:/SuiteScripts/Deploy_Extensions/Maddocks/Maddocks@1.0.7/Modules/BaseSassStyles/Sass/_main-atoms.scss 27:9 @import\nfilecabinet:/SuiteScripts/Deploy_Extensions/Maddocks/Maddocks@1.0.7/Modules/Checkout/checkout.scss 49:9 @import\nfilecabinet:/Web%20Site%20Hosting%20Files/Live%20Hosting%20Files/SSP%20Applications/NetSuite%20Inc.%20-%20SCA%202022.1.0/Development/extensions/meta_checkout_34.scss 33:9 root stylesheet\n",
          "src": "filecabinet:/SuiteScripts/Deploy_Extensions/Maddocks/Maddocks@1.0.7/Modules/BaseSassStyles/Sass/atoms/_buttons.scss 325:11 @import\nfilecabinet:/SuiteScripts/Deploy_Extensions/Maddocks/Maddocks@1.0.7/Modules/BaseSassStyles/Sass/_main-atoms.scss 27:9 @import\nfilecabinet:/SuiteScripts/Deploy_Extensions/Maddocks/Maddocks@1.0.7/Modules/Checkout/checkout.scss 49:9 @import\nfilecabinet:/Web%20Site%20Hosting%20Files/Live%20Hosting%20Files/SSP%20Applications/NetSuite%20Inc.%20-%20SCA%202022.1.0/Development/extensions/meta_checkout_34.scss 33:9 root stylesheet\n",
          "detail": "Error: compound selectors may no longer be extended.\nConsider `@extend .button-secondary, :hover` instead.\nSee <https://sass-lang.com/d/extend-compound> for details.\n\n ╷\n325 │ @extend .button-secondary:hover;\n │ ^^^^^^^^^^^^^^^^^^^^^^^\n ╵\n filecabinet:/SuiteScripts/Deploy_Extensions/Maddocks/Maddocks@1.0.7/Modules/BaseSassStyles/Sass/atoms/_buttons.scss 325:11 @import\n filecabinet:/SuiteScripts/Deploy_Extensions/Maddocks/Maddocks@1.0.7/Modules/BaseSassStyles/Sass/_main-atoms.scss 27:9 @import\n filecabinet:/SuiteScripts/Deploy_Extensions/Maddocks/Maddocks@1.0.7/Modules/Checkout/checkout.scss 49:9 @import\n filecabinet:/Web%20Site%20Hosting%20Files/Live%20Hosting%20Files/SSP%20Applications/NetSuite%20Inc.%20-%20SCA%202022.1.0/Development/extensions/meta_checkout_34.scss 33:9 root stylesheet",
          "text": "compound selectors may no longer be extended.\nConsider `@extend .button-secondary, :hover` instead.\nSee <https://sass-lang.com/d/extend-compound> for details.\n",
          "severity": {
            "label": "ERROR",
            "value": 3
          }
        }
      ]
    }
  },
  "notifyOff": false,
  "userFacing": true
}
s
We are using a custom theme based off 2020 SuiteCommerce Base Theme. Is there a patch we can implement to make it compatible?
Well, no. As it stands it probably won’t be compatible but it depends on your customisations. There’s no patch because it is entirely dependent on the syntax in your theme. The base theme was updated, so that would serve as a new starting point. Otherwise you will need to include the 
--dart
parameter after your deploy, eg 
gulp theme:deploy --dart
Copy code
compound selectors may no longer be extended.\nConsider `@extend .button-secondary, :hover` instead.\nSee <https://sass-lang.com/d/extend-compound> for details.
This is the main problem. Your problem is not to do with the issue that your case has been assigned to
You should have received a PFCN from NetSuite about this change with instructions on how to adapt your theme for Dart Sass
(This particular error is also described in the page linked in the error message: https://sass-lang.com/d/extend-compound)
g
Thanks Steve. I have just located the email we received regarding Dart Sass
After making some changes to scss, I have managed to get the activation to complete. Now I am experiencing an Uncaught error when trying to load the website.
Copy code
shopping.js?t=1701251344155:1 Uncaught Error: View doesn't have a template
    at n.compileTemplate (shopping.js?t=1701251344155:1:368703)
    at n._render (shopping.js?t=1701251344155:1:369138)
    at n.render (shopping.js?t=1701251344155:1:369839)
    at n.render (shopping.js?t=1701251344155:1:568215)
    at n.updateMenuItemsUI (shopping.js?t=1701251344155:1:569463)
    at m.updateProductListMenu (shopping.js?t=1701251344155:1:617849)
    at shopping.js?t=1701251344155:1:1119008
    at r (shopping.js?t=1701251344155:1:45784)
    at Object.fireWith [as resolveWith] (shopping.js?t=1701251344155:1:46552)
    at s.<computed> [as resolve] (shopping.js?t=1701251344155:1:48450)
Would this be related to the JS error that is on the defect?
s
The JS error is an activation error; if it activates fine, then it won’t be that. As the error says, it looks like there’s a template file missing.
at n.updateMenuItemsUI (shopping.js?t=17012513441551569463)
at m.updateProductListMenu (shopping.js?t=17012513441551617849)
Are these names of views? If so, do they have a template declared and are those templates in the theme (including the manifest)?
g
All the files match with what we currently run in production. I don't recognise the names of the views above
s
updateMenuItemsUI
is a function in MenuTree.View, which uses menu_tree.tpl. You have that?
g
template exists
s
Also have you cleared your cache?
g
Yes, ran a cache invalidation, emptied browser cache and ran the site in incognito mode
s
Can you run this in your browser console when visiting your site:
Copy code
_.compact(_.map(requirejs._defined, function (val, key) {if (val == undefined && key.indexOf('.tpl') !== -1) {return key}}))
g
done - what should the expected result be?
s
Well it tries to identify template files that are don’t have values
So it should be an array of file names
… are you going to tell me what it says? 😅
g
literally says {} length: 0 and then a drop down to other objects starting with {{Prototype}}: Array(0)
c
It would be really helpful if the 
--dart
was included in the 
gulp
output!!
b
When i run the command gulp extension:deploy --account 1259134-sb1 --dart i get no errors in the console but when i go to NS and activate the extension deployed i get this error: {"type":"error.SuiteScriptError","name":"78319","message":"Compiler was unable to compile the given input file.","id":null,"stack":["createError(N/error)"],"cause":{"message":"Compiler was unable to compile the given input file.","stack":["createError(N/error)","map(/SuiteBundles/Bundle 500777/ExtensionMechanism.Server/CompilersMapReduce/SassCompilerMapReduce.js:160)"],"name":"78319","data":{"response":null,"notifications":[{"message":"Compilation error occured.","status":"1","json":"expected \"=\".","file":"filecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.0.24/Modules/BaseSassStyles/Sass/atoms/_purchase-controls.scss 238:65 @import\nfilecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.0.24/Modules/BaseSassStyles/Sass/_main-atoms.scss 32:9 @import\nfilecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.0.24/Modules/Checkout/checkout.scss 49:9 @import\nfilecabinet:/Web%20Site%20Hosting%20Files/Live%20Hosting%20Files/SSP%20Applications/NetSuite%20Inc.%20-%20SCA%202022.2.0/Development/extensions/meta_checkout_2.scss 33:9 root stylesheet\n","src":"filecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.0.24/Modules/BaseSassStyles/Sass/atoms/_purchase-controls.scss 238:65 @import\nfilecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.0.24/Modules/BaseSassStyles/Sass/_main-atoms.scss 32:9 @import\nfilecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.0.24/Modules/Checkout/checkout.scss 49:9 @import\nfilecabinet:/Web%20Site%20Hosting%20Files/Live%20Hosting%20Files/SSP%20Applications/NetSuite%20Inc.%20-%20SCA%202022.2.0/Development/extensions/meta_checkout_2.scss 33:9 root stylesheet\n","detail":"Error: expected \"=\".\n ╷\n238 │ -ms-filter: \"progid:DXImageTransform.Microsoft.Alpha\"(Opacity=0);\n │ ^\n ╵\n filecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.0.24/Modules/BaseSassStyles/Sass/atoms/_purchase-controls.scss 238:65 @import\n filecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.0.24/Modules/BaseSassStyles/Sass/_main-atoms.scss 32:9 @import\n filecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.0.24/Modules/Checkout/checkout.scss 49:9 @import\n filecabinet:/Web%20Site%20Hosting%20Files/Live%20Hosting%20Files/SSP%20Applications/NetSuite%20Inc.%20-%20SCA%202022.2.0/Development/extensions/meta_checkout_2.scss 33:9 root stylesheet","text":"expected \"=\".","severity":{"label":"ERROR","value":3}}]}},"notifyOff":false,"userFacing":true}
s
Have you updated the SCEM bundle?
b
In my prod and SB accounts I have the 2023.2.0 version.
I see now that there is an update 2023.2.1
I will update SB now.
I got the new dev tools 23.2.1. Gulp command check-dart-sass is there now. 🙂 I could fetch the theme and got some errors regarding scss. Thank you @Steve Goldberg!
@GWilliams Hi! Sorry to bug you but I was wondering if you got this error when deploying the theme using the new dart library in netsuite?
Copy code
Error: argument `$number` of `floor($number)` must be a number
I updated all the files based on the error thrown when I ran gulp check-dart-sass but I keep seeing the errors thrown in the temp folder.
g
Sorry @Berenice Domínguez, I am yet to update to the new version of dev tools. I am still using 23.1.4 on 23.2.0 extension manager. This way of working has been stable enough to continue development work. I will check out the new version upon my return to work😃
✅ 1
b
I am concerned about the new dart library when we upgrade to 2024.1.
g
It doesn't fill me with confidence ahead of 2024.1. There have been quite a few issues in recent weeks with SCEM and dev tools. Not entirely sure why the change in compiler to dart sass. NetSuite will have their reasons for doing so.
The NetSuite release 2024.1 has caused problems throughout our business operation. Fingers crossed it goes better for SCA 2024.1.
b
I know right? Quick question is there something I am missing? I mean why the gulp dart-sass is checking the tmp folder?
I fixed the files with the issues but still i am getting the same errors even after i fixed them when running the same command, also i can't deploy the theme bc of the same errors.
@Steve Goldberg Hi! I updated the dev tools to 2023.2.1 i fixed the sass errors and i was able to deploy the theme to Sandbox last thursday. I was off on friday so today i realized that the new 2024.1 version was released to SB. I tried to deploy the theme again (no --dart) and i am getting this error:
Copy code
[09:37:24] Starting 'pre-templates'...
[09:37:24] Starting 'sass-prepare'...
[09:37:24] Starting 'update-manifest'...
[09:37:24] 'update-manifest' errored after 22 ms
[09:37:24] /Users/berenice/Documents/github/2024_1/Dev Tools 23.2.1/afg-22-sca-theme-dev/gulp/extension-mechanism/update-manifest/update-manifest-resources.js:380
			if(templatesArray?.length || Object.entries(templatesArray).length)
			                  ^

SyntaxError: Unexpected token '.'
    at wrapSafe (internal/modules/cjs/loader.js:1047:16)
    at Module._compile (internal/modules/cjs/loader.js:1097:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1153:10)
    at Module.load (internal/modules/cjs/loader.js:977:32)
    at Function.Module._load (internal/modules/cjs/loader.js:877:14)
    at Module.require (internal/modules/cjs/loader.js:1019:19)
    at require (internal/modules/cjs/helpers.js:77:18)
    at Object.<anonymous> (/Users/berenice/Documents/github/2024_1/Dev Tools 23.2.1/afg-22-sca-theme-dev/gulp/extension-mechanism/update-manifest/update-manifest-task.js:9:23)
    at Module._compile (internal/modules/cjs/loader.js:1133:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1153:10)
[09:37:24] 'update-validate' errored after 24 ms
[09:37:24] 'theme:deploy' errored after 2.4 s
Any ideas why? I am using node 12.16.3
s
Use Node 14.19.0. Not sure why you’re using that version 🙂
b
Thank you!
Quick question, do you know if i need to uninstall node-sass and install just sass? I read that this issue will be solved f i do that but I am not sure.
Copy code
formatted: Error: Invalid CSS after "...e:         math": expected expression (e.g. 1px, bold), was ".ceil(($font-size-b"
        on line 54 of tmp/AFG_2022_2_Theme/Modules/twitter-bootstrap-sass/3.4.1/assets/stylesheets/bootstrap/_variables.scss
        from line 10 of tmp/AFG_2022_2_Theme/Modules/Shopping/shopping.scss
        from line 1 of shopping.scss
>> $font-size-large:         math.ceil(($font-size-base * 1.25)) !default; // ~
   ------------------------------^
Last week i fixed all those errors in the theme and was able to deploy but the upgrade to 2024.1 is giving me errors again.
s
I don’t know. But based on the error, your chosen syntax is not correct
b
I got the theme deployed, fixed all the errors in the scss files. Now i am trying to activate it in Sandbox but i am getting these errors:
Copy code
{
  "type": "error.SuiteScriptError",
  "name": "78825",
  "message": "Compiler was unable to compile the given input file.",
  "id": null,
  "stack": [
    "createError(N/error)"
  ],
  "cause": {
    "message": "Compiler was unable to compile the given input file.",
    "stack": [
      "createError(N/error)",
      "map(/SuiteBundles/Bundle 500777/ExtensionMechanism.Server/CompilersMapReduce/SassCompilerMapReduce.js:165)"
    ],
    "name": "78825",
    "data": {
      "response": null,
      "notifications": [
        {
          "message": "Compilation error occured.",
          "status": "1",
          "json": "@use rules must be written before any other rules.",
          "file": "filecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.1.0/Modules/twitter-bootstrap-sass/3.4.1/assets/stylesheets/bootstrap/_variables.scss 27:1 @import\nfilecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.1.0/Modules/Checkout/checkout.scss 27:9 @import\nfilecabinet:/Web%20Site%20Hosting%20Files/Live%20Hosting%20Files/SSP%20Applications/NetSuite%20Inc.%20-%20SCA%202022.2.0/Development/extensions/meta_checkout_2.scss 33:9 root stylesheet\n",
          "src": "filecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.1.0/Modules/twitter-bootstrap-sass/3.4.1/assets/stylesheets/bootstrap/_variables.scss 27:1 @import\nfilecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.1.0/Modules/Checkout/checkout.scss 27:9 @import\nfilecabinet:/Web%20Site%20Hosting%20Files/Live%20Hosting%20Files/SSP%20Applications/NetSuite%20Inc.%20-%20SCA%202022.2.0/Development/extensions/meta_checkout_2.scss 33:9 root stylesheet\n",
          "detail": "Error: @use rules must be written before any other rules.\n ╷\n27 │ @use 'sass:math';\n │ ^^^^^^^^^^^^^^^^\n ╵\n filecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.1.0/Modules/twitter-bootstrap-sass/3.4.1/assets/stylesheets/bootstrap/_variables.scss 27:1 @import\n filecabinet:/SuiteScripts/Deploy_Extensions/AFG/AFG_2022_2_Theme@1.1.0/Modules/Checkout/checkout.scss 27:9 @import\n filecabinet:/Web%20Site%20Hosting%20Files/Live%20Hosting%20Files/SSP%20Applications/NetSuite%20Inc.%20-%20SCA%202022.2.0/Development/extensions/meta_checkout_2.scss 33:9 root stylesheet",
          "text": "@use rules must be written before any other rules.",
          "severity": {
            "label": "ERROR",
            "value": 3
          }
        }
      ]
    }
  },
  "notifyOff": false,
  "userFacing": true
}
s
Again, based on the error: 
"@use rules must be written before any other rules."
b
Hi @Steve Goldberg I fixed all the issues in the theme, deployed it (gulp theme:deploy) and when i tried to activate it in sandbox i get the error below. I am not getting any errors related to sass. Seems that the bundle 500777 version 2023.2.1 is having some issues. Advice please, thank you!
Copy code
{
  "type": "error.SuiteScriptError",
  "name": "79749",
  "message": "Compiler was unable to compile the given input file.",
  "id": null,
  "stack": [
    "createError(N/error)"
  ],
  "cause": {
    "message": "Compiler was unable to compile the given input file.",
    "stack": [
      "createError(N/error)",
      "map(/SuiteBundles/Bundle 500777/ExtensionMechanism.Server/CompilersMapReduce/SassCompilerMapReduce.js:165)"
    ],
    "name": "79749",
    "data": {
      "response": null,
      "notifications": []
    }
  },
  "notifyOff": false,
  "userFacing": true
}
c
I just ran into the 
View doesn't have a template
error again. I rolled back to 23.1.3 theme tools and the problem went away. I don't know the root cause.
b
But how does not affect the new dart library?
w
I got to be honest this is a quite frustrating migration process..😞
💯 1
115 Views
Open in Slack
PreviousNext
Powered by