Title: New css2json-loader fails · Issue #1138 · NativeScript/nativescript-dev-webpack · GitHub
Open Graph Title: New css2json-loader fails · Issue #1138 · NativeScript/nativescript-dev-webpack
X Title: New css2json-loader fails · Issue #1138 · NativeScript/nativescript-dev-webpack
Description: Environment Provide version numbers for the following components (information can be retrieved by running tns info in your project folder or by inspecting the package.json of the project): CLI: 6.5.0 Cross-platform modules: 6.5.1 Android...
Open Graph Description: Environment Provide version numbers for the following components (information can be retrieved by running tns info in your project folder or by inspecting the package.json of the project): CLI: 6.5...
X Description: Environment Provide version numbers for the following components (information can be retrieved by running tns info in your project folder or by inspecting the package.json of the project): CLI: 6.5...
Opengraph URL: https://github.com/NativeScript/nativescript-dev-webpack/issues/1138
X: @github
Domain: patch-diff.githubusercontent.com
{"@context":"https://schema.org","@type":"DiscussionForumPosting","headline":"New css2json-loader fails","articleBody":"**Environment**\r\nProvide version numbers for the following components (information can be retrieved by running `tns info` in your project folder or by inspecting the `package.json` of the project):\r\n - CLI: 6.5.0\r\n - Cross-platform modules: 6.5.1\r\n - Android Runtime: 6.5.0\r\n - iOS Runtime: 6.5.0\r\n - Plugin(s):\r\n - Node.js: 12.7.0\r\n \r\n - [ ] Please, attach your package.json and webpack.config.js as these configurations are usually critical for investigating issues with webpack\r\n \r\nI can't attach these because the file type of json and js is not allowed in the below attach file section. But they are in a public repo [here](https://github.com/animalus/shared-lib-example). As is the scss file I'm showing here. You can actually just clone that repo and reproduce this problem for yourself by running (npm i; gulp dev:android) after replacing webpack.config.js with the version webpack.config.ORIG.js. The latter of which is really just `tns run android --env.aot --no-hmr` after compiling pug files to html files.\r\n\r\n**Describe the bug**\r\n\u003c!-- A clear and concise description of what the bug is. Please, explain whether it's a build time error or a runtime error. More detailed logs can be easily obtained by following the instructions in this guide: https://docs.nativescript.org/get-support#how-to-obtain-diagnostic-reports. --\u003e\r\n\r\nThe following scss file causes webpack.config.js to fail with ...\r\n\r\n```\r\nJS: Error: Could not load CSS from app.css: ReferenceError: undefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefinedundefined is not defined\r\n```\r\n\r\n```\r\n* {\r\n font-size: 16;\r\n}\r\n\r\n.bigger-font {\r\n font-size: 24;\r\n}\r\n\r\n.big-font {\r\n font-size: 19;\r\n}\r\n\r\n.centered {\r\n text-align: center;\r\n}\r\n\r\n.bold {\r\n font-weight: bold;\r\n}\r\n\r\n.width100 {\r\n width: 100%;\r\n}\r\n```\r\n\r\nIf you comment out the bottom three entries say then it works fine. Various other combinations of commenting out and in of different entries results in success or failure. Only difference being the number of \"undefinedundefined....\" values. \r\n\r\n**To Reproduce**\r\n\u003c!-- Add commands used or steps taken to reproduce the behaviour. --\u003e\r\n\r\nSee above.\r\n\r\n**Expected behavior**\r\n\r\nNot fail to compile bundle.\r\n\r\n**Sample project**\r\n\u003c!-- If possible, consider attaching a sample project or link to a repository with such project. --\u003e\r\n\r\nSee above.\r\n\r\n**Additional context**\r\n\u003c!-- Add any other context about the problem here. --\u003e\r\n\r\nIf I change the scss loader in the `webpack.config.js` file back to the css-loader it was on the last release I had installed, namely ...\r\n\r\n```\r\ndiff --git a/webpack.config.js b/webpack.config.js\r\nindex f0b43bb..871928d 100644\r\n--- a/webpack.config.js\r\n+++ b/webpack.config.js\r\n@@ -264,8 +264,8 @@ module.exports = env =\u003e {\r\n use: [\r\n \"nativescript-dev-webpack/style-hot-loader\",\r\n {\r\n- loader: \"nativescript-dev-webpack/css2json-loader\",\r\n- options: { useForImports: true }\r\n+ loader: \"css-loader\",\r\n+ options: { url: false }\r\n },\r\n \"sass-loader\"\r\n ]\r\n```\r\n\r\n... then it works fine. So that is what I am doing for now, reverting back to the old loader until this issue is resolved. Cheers.","author":{"url":"https://github.com/crowmagnumb","@type":"Person","name":"crowmagnumb"},"datePublished":"2020-05-15T19:44:20.000Z","interactionStatistic":{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":0},"url":"https://github.com/1138/nativescript-dev-webpack/issues/1138"}
| route-pattern | /_view_fragments/issues/show/:user_id/:repository/:id/issue_layout(.:format) |
| route-controller | voltron_issues_fragments |
| route-action | issue_layout |
| fetch-nonce | v2:7d922534-a062-1e97-a187-6349acce7ee6 |
| current-catalog-service-hash | 81bb79d38c15960b92d99bca9288a9108c7a47b18f2423d0f6438c5b7bcd2114 |
| request-id | BF7A:14FB0B:7E56F4D:A36F291:6975C770 |
| html-safe-nonce | 0073684828a67249dea954ea4f89d836752bd3289ed777a61c7fd3ff3e0c0f28 |
| visitor-payload | eyJyZWZlcnJlciI6IiIsInJlcXVlc3RfaWQiOiJCRjdBOjE0RkIwQjo3RTU2RjREOkEzNkYyOTE6Njk3NUM3NzAiLCJ2aXNpdG9yX2lkIjoiODczNTE0ODEwODA2MTk4NDYyNCIsInJlZ2lvbl9lZGdlIjoiaWFkIiwicmVnaW9uX3JlbmRlciI6ImlhZCJ9 |
| visitor-hmac | 2d941d6d60cefabd53c203aab5df88197c7fa39d95a1b3ad3f445a925459ffd7 |
| hovercard-subject-tag | issue:619201652 |
| github-keyboard-shortcuts | repository,issues,copilot |
| google-site-verification | Apib7-x98H0j5cPqHWwSMm6dNU4GmODRoqxLiDzdx9I |
| octolytics-url | https://collector.github.com/github/collect |
| analytics-location | / |
| fb:app_id | 1401488693436528 |
| apple-itunes-app | app-id=1477376905, app-argument=https://github.com/_view_fragments/issues/show/NativeScript/nativescript-dev-webpack/1138/issue_layout |
| twitter:image | https://opengraph.githubassets.com/7022bacd67f66d4842d53c8e59496d503c225df1dc0319fcfc1d268f0654ae68/NativeScript/nativescript-dev-webpack/issues/1138 |
| twitter:card | summary_large_image |
| og:image | https://opengraph.githubassets.com/7022bacd67f66d4842d53c8e59496d503c225df1dc0319fcfc1d268f0654ae68/NativeScript/nativescript-dev-webpack/issues/1138 |
| og:image:alt | Environment Provide version numbers for the following components (information can be retrieved by running tns info in your project folder or by inspecting the package.json of the project): CLI: 6.5... |
| og:image:width | 1200 |
| og:image:height | 600 |
| og:site_name | GitHub |
| og:type | object |
| og:author:username | crowmagnumb |
| hostname | github.com |
| expected-hostname | github.com |
| None | 4a4bf5f4e28041a9d2e5c107d7d20b78b4294ba261cab243b28167c16a623a1f |
| turbo-cache-control | no-preview |
| go-import | github.com/NativeScript/nativescript-dev-webpack git https://github.com/NativeScript/nativescript-dev-webpack.git |
| octolytics-dimension-user_id | 7392261 |
| octolytics-dimension-user_login | NativeScript |
| octolytics-dimension-repository_id | 54984270 |
| octolytics-dimension-repository_nwo | NativeScript/nativescript-dev-webpack |
| octolytics-dimension-repository_public | true |
| octolytics-dimension-repository_is_fork | false |
| octolytics-dimension-repository_network_root_id | 54984270 |
| octolytics-dimension-repository_network_root_nwo | NativeScript/nativescript-dev-webpack |
| turbo-body-classes | logged-out env-production page-responsive |
| disable-turbo | false |
| browser-stats-url | https://api.github.com/_private/browser/stats |
| browser-errors-url | https://api.github.com/_private/browser/errors |
| release | 488b30e96dfd057fbbe44c6665ccbc030b729dde |
| ui-target | full |
| theme-color | #1e2327 |
| color-scheme | light dark |
Links:
Viewport: width=device-width