search

NervJS / taro

开放式跨端跨框架解决方案，支持使用 React/Vue/Nerv 等框架来开发微信/京东/百度/支付宝/字节跳动/ QQ 小程序/H5/React Native 等应用。 https://taro.zone/
https://docs.taro.zone/
Other
35.46k stars 4.78k forks source link

scss 书写错误导致 taro-cli 进程中断 #2852

Closed huixisheng closed 4 years ago

huixisheng commented 5 years ago

问题描述 scss 书写错误导致 taro-cli 进程中断

复现步骤 对 scss 文件，书写错误的语法

期望行为 taro-cli 进程不中断

报错信息

修改  样式文件  src/pages/guide-test/index.wxss
{ Error: Expected expression.
   ╷
12 │     margin-bottom: 
   │                    ^
   ╵
  src/pages/guide-test/index.scss 12:20  root stylesheet
    at Object.BI (${Workspace}/node_modules/@tarojs/plugin-sass/node_modules/dart-sass/sass.dart.js:5233:30)
    at Object.Ei (${Workspace}/node_modules/@tarojs/plugin-sass/node_modules/dart-sass/sass.dart.js:5149:34)
    at nF.E8 (${Workspace}/node_modules/@tarojs/plugin-sass/node_modules/dart-sass/sass.dart.js:5135:5)
    at Object.GZ (${Workspace}/node_modules/@tarojs/plugin-sass/node_modules/dart-sass/sass.dart.js:463:69)
    at Object.hA (${Workspace}/node_modules/@tarojs/plugin-sass/node_modules/dart-sass/sass.dart.js:2191:27)
    at HV (${Workspace}/node_modules/@tarojs/plugin-sass/node_modules/dart-sass/sass.dart.js:2991:27)
    at Object.renderSync (${Workspace}/node_modules/@tarojs/plugin-sass/node_modules/dart-sass/sass.dart.js:2980:42)
    at Promise (${Workspace}/node_modules/@tarojs/plugin-sass/index.js:34:21)
    at new Promise (<anonymous>)
    at compileSass (${Workspace}/node_modules/@tarojs/plugin-sass/index.js:5:10)
  formatted:
   'Error: Expected expression.\n   ╷\n12 │     margin-bottom: \n   │                    ^\n   ╵\n  src/pages/guide-test/index.scss 12:20  root stylesheet',
  line: 12,
  column: 20,
  file:
   '${Workspace}/src/pages/guide-test/index.scss',
  status: 1 }

系统信息

👽 Taro v1.2.23

  Taro CLI 1.2.23 environment info:
    System:
      OS: macOS 10.14.4
      Shell: 5.3 - /bin/zsh
    Binaries:
      Node: 10.15.3 - /usr/local/bin/node
      Yarn: 1.15.2 - /usr/local/bin/yarn
      npm: 6.4.1 - /usr/local/bin/npm
    npmPackages:
      @tarojs/async-await: ^1.2.23 => 1.2.26 
      @tarojs/cli: ^1.2.23 => 1.2.26 
      @tarojs/components: ^1.2.26 => 1.2.26 
      @tarojs/mobx: ^1.2.26 => 1.2.26 
      @tarojs/mobx-h5: ^1.2.26 => 1.2.26 
      @tarojs/mobx-rn: ^1.2.26 => 1.2.26 
      @tarojs/plugin-babel: 1.2.26 => 1.2.26 
      @tarojs/plugin-csso: 1.2.26 => 1.2.26 
      @tarojs/plugin-sass: 1.2.26 => 1.2.26 
      @tarojs/plugin-uglifyjs: 1.2.26 => 1.2.26 
      @tarojs/rn-runner: ^1.2.26 => 1.2.26 
      @tarojs/router: ^1.2.26 => 1.2.26 
      @tarojs/taro: ^1.2.26 => 1.2.26 
      @tarojs/taro-alipay: ^1.2.26 => 1.2.26 
      @tarojs/taro-h5: ^1.2.26 => 1.2.26 
      @tarojs/taro-swan: ^1.2.26 => 1.2.26 
      @tarojs/taro-tt: ^1.2.26 => 1.2.26 
      @tarojs/taro-weapp: ^1.2.26 => 1.2.26 
      @tarojs/webpack-runner: 1.2.26 => 1.2.26 
      eslint-config-taro: 1.2.26 => 1.2.26 
      eslint-plugin-taro: 1.2.26 => 1.2.26 
      nervjs: ^1.3.9 => 1.3.13
taro-bot[bot] commented 5 years ago

欢迎提交 Issue~

如果你提交的是 bug 报告，请务必遵循 Issue 模板的规范，尽量用简洁的语言描述你的问题，最好能提供一个稳定简单的复现。🙏🙏🙏

如果你的信息提供过于模糊或不足，或者已经其他 issue 已经存在相关内容，你的 issue 有可能会被关闭。

Good luck and happy coding~

taro-bot[bot] commented 5 years ago

CC @luckyadam

markgzl commented 5 years ago

遇到了同样的问题，scss 书写错误，cli 进程直接退出 image

Garfield550 commented 5 years ago

这个问题是 taro 换用 dart-sass 以后出现的问题，怀疑是没有 handle dart-sass 的错误输出

Garfield550 commented 5 years ago

@luckyadam 另外在 taro-sample-weapp 里面引入 wxss 文件，dart-sass 无法处理，由于都是 dart-sass 相关的问题我就不开新 issue 了

https://github.com/NervJS/taro-sample-weapp/blob/42f2d1b09c073105c5e9f8456fec7133dc1deec2/src/pages/wxParse/wxParse.scss#L1

生成  依赖文件  dist/utils/util.js
{ Error: Can't find stylesheet to import.
  ╷
1 │ @import "../../components/wxParse/wxParse.wxss";
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  src/pages/wxParse/wxParse.scss 1:9  root stylesheet
    at Object.BI (/Users/<NAME>/Downloads/taro-sample-weapp-master/node_modules/@tarojs/plugin-sass/node_modules/dart-sass/sass.dart.js:5233:30)
    at Object.Ei (/Users/<NAME>/Downloads/taro-sample-weapp-master/node_modules/@tarojs/plugin-sass/node_modules/dart-sass/sass.dart.js:5149:34)
    at nF.E8 (/Users/<NAME>/Downloads/taro-sample-weapp-master/node_modules/@tarojs/plugin-sass/node_modules/dart-sass/sass.dart.js:5135:5)
    at Object.GZ (/Users/<NAME>/Downloads/taro-sample-weapp-master/node_modules/@tarojs/plugin-sass/node_modules/dart-sass/sass.dart.js:463:69)
    at Object.hB (/Users/<NAME>/Downloads/taro-sample-weapp-master/node_modules/@tarojs/plugin-sass/node_modules/dart-sass/sass.dart.js:2191:27)
    at HV (/Users/<NAME>/Downloads/taro-sample-weapp-master/node_modules/@tarojs/plugin-sass/node_modules/dart-sass/sass.dart.js:2991:27)
    at Object.renderSync (/Users/<NAME>/Downloads/taro-sample-weapp-master/node_modules/@tarojs/plugin-sass/node_modules/dart-sass/sass.dart.js:2980:42)
    at Promise (/Users/<NAME>/Downloads/taro-sample-weapp-master/node_modules/@tarojs/plugin-sass/index.js:34:21)
    at new Promise (<anonymous>)
    at compileSass (/Users/<NAME>/Downloads/taro-sample-weapp-master/node_modules/@tarojs/plugin-sass/index.js:5:10)
  formatted:
   `Error: Can't find stylesheet to import.\n  ╷\n1 │ @import "../../components/wxParse/wxParse.wxss";\n  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^\n  ╵\n  src/pages/wxParse/wxParse.scss 1:9  root stylesheet`,
  line: 1,
  column: 9,
  file:
   '/Users/<NAME>/Downloads/taro-sample-weapp-master/src/pages/wxParse/wxParse.scss',
  status: 1 }
✨  Done in 8.12s.
~/Downloads/taro-sample-weapp-master>
更新 (JS 里引入 wxss 文件 build 模式失败问题已解决) 更新： 这个是 wxParser 里 index.wxss 有错误造成的 https://github.com/ifanrx/wxParser/blob/deec830eace2f53216ff4986af6075a78f3045d1/wxParser/index.wxss#L5-L7 4/30 补充： ~~另外如果在 JS 里引入 wxss 文件~~ ~~`yarn dev:weapp` 可以编译通过~~ ~~`yarn build:weapp` 则会失败~~ ```tsx /* eslint react/forbid-elements: 0 */ import classNames from 'classnames'; import { View } from '@tarojs/components'; import Taro from '@tarojs/taro'; import GtComponent, { GtComponentProps } from '../GtComponent'; import wxParser from './wxParser/index'; import './wxParser/index.wxss'; ```
yarn dev:weapp ``` 编译 组件文件 src/Components/Index.ts 编译 组件文件 src/Components/WxParser/Index.tsx 生成 组件配置 dist/dist/Components/WxParser/Index.json 生成 组件逻辑 dist/dist/Components/WxParser/Index.js 生成 组件模板 dist/dist/Components/WxParser/Index.wxml 生成 组件样式 dist/dist/Components/WxParser/Index.wxss 生成 依赖文件 dist/Components/WxParser/wxParser/index.js 生成 依赖文件 dist/Components/WxParser/wxParser/html2json.js 生成 依赖文件 dist/Components/WxParser/wxParser/utils.js 生成 依赖文件 dist/Components/WxParser/wxParser/elements.js 生成 依赖文件 dist/Components/WxParser/wxParser/codeTransformation.js 生成 依赖文件 dist/Components/WxParser/wxParser/htmlparser.js ```
yarn build:weapp ``` 错误 组件编译 组件src/Components/WxParser/Index.tsx编译失败！ TypeError: Cannot read property 'isEmpty' of undefined at Object.cleanRuleset (/Users//Projects///node_modules/csso/lib/clean/Rule.js:83:31) at Object.leave (/Users//Projects///node_modules/csso/lib/clean/index.js:16:37) at List.walkNode (/Users//Projects///node_modules/css-tree/lib/walker/create.js:161:19) at List.each (/Users//Projects///node_modules/css-tree/lib/utils/list.js:159:12) at Object.eval [as StyleSheet] (eval at createTypeIterator (/Users//Projects///node_modules/css-tree/lib/walker/create.js:112:12), :5:15) at walkNode (/Users//Projects///node_modules/css-tree/lib/walker/create.js:158:37) at walk (/Users//Projects///node_modules/css-tree/lib/walker/create.js:214:9) at module.exports (/Users//Projects///node_modules/csso/lib/clean/index.js:13:5) at compressChunk (/Users//Projects///node_modules/csso/lib/compress.js:68:5) at compress (/Users//Projects///node_modules/csso/lib/compress.js:153:9) // 使用到 WxParser 的页面 错误 页面编译 页面src/Pages/Store/Detail编译失败！ TypeError: Cannot read property 'wxss' of undefined at buildDepComponentsResult.map.item (/Users//Projects///node_modules/@tarojs/cli/src/weapp.js:1686:23) at Array.map () at getDepStyleList (/Users//Projects///node_modules/@tarojs/cli/src/weapp.js:1685:44) at buildSinglePage (/Users//Projects///node_modules/@tarojs/cli/src/weapp.js:1437:28) at processTicksAndRejections (internal/process/task_queues.js:86:5) at process.runNextTicks [as _tickCallback] (internal/process/task_queues.js:56:3) at Function.Module.runMain (internal/modules/cjs/loader.js:880:11) at internal/main/run_main_module.js:21:11 ```
YTU94 commented 5 years ago

解决办法是什么，现在用的less, 也是这样的

luckyadam commented 5 years ago

@Garfield550 看来要换回 node-sass 了， dart-sass 有一系列问题

YTU94 commented 5 years ago

坐等更新

sufaith commented 5 years ago

这个问题困扰了好多天,每次都要重新运行,相当麻烦~

flyrui316 commented 5 years ago

遇到同样的问题

taro-bot[bot] commented 4 years ago

Hello~

您的问题楼上已经有了确切的回答，如果没有更多的问题这个 issue 将在 15 天后被自动关闭。

如果您在这 15 天中更新更多信息自动关闭的流程会自动取消，如有其他问题也可以发起新的 Issue。

Good luck and happy coding~