问题描述
新建项目运行dev:h5报错
复现步骤
taro init demo
cnpm i
npm run dev:h5
/**
* 这段注释后可以贴代码
* 提供完整可复现的代码和整理好代码格式，有助于我们快速定位问题，节省你我时间
* 代码提供不全或代码格式混乱的 issues 【有可能会被忽略】
*
* 查看如何插入代码：https://coding.net/help/doc/project/markdown.html#i-5
*/
期望行为
demo运行应该正常
报错信息
Failed to compile.
./node_modules/_@[email protected]@@tarojs/components/src/components/video/style/index.scss 1:0
Module parse failed: Unexpected character '@' (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
@charset "UTF-8";
|
| .taro-video {
系统信息
补充信息
如果您有功能上的建议，可以提到 FeatHub
使用上的问题，欢迎在「Taro 社区」一起交流
dengshihao
All 22 comments
Taro v2.2.9
dengshihao
on 17 Jun 2020
提供一下 demo 看看
luckyadam
on 17 Jun 2020
遇到同样问题
fishjar
on 18 Jun 2020
@luckyadam 你直接按你们官方的安装教程走一遍运行就能出现这个问题
abellee
on 18 Jun 2020
+1 同样问题
使用: Typescript
模版类型： redux
css预处理脚本： less
选了这几个之后用 h5 编译就会报错了
最小可复现问题仓库 :
https://github.com/leoliew/taro_debug_demo
@luckyadam
leoliew
on 20 Jun 2020
官方教程都跑不起来?
hy08
on 22 Jun 2020
所以这个问题解决了吗
a591371947
on 23 Jun 2020
解决了没，
第一步，就遇到坑， 没想到，坑里还有水，水下藏着钉，钉子还有尖儿，
zoeblow
on 23 Jun 2020
mark
iaminvictus1993
on 24 Jun 2020
我今天也遇到了类似问题，感觉还是webpack、 sass-loader向设定的问题，我目前本机的版本是Taro2.2.7 Taro-UI 2.3.1。
$yarn dev:weapp
./node_modules/taro-ui/dist/style/index.scss 6:0
Module parse failed: Unexpected character '@' (6:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|
| /* Variables */
> @import './variables/default.scss';
|
| /* Mixin */
我业务代码啥也没动，就升级包，降包。
我整个程序（前端、后端）都开发完了，想优化下。
这几天开发遇到了不下5个问题，有Taro的有Taro-UI的。有些问题看到有人提过，并且还在后续的版本中似乎有修复，所以整个项目历程从Taro2.0升到了2.2.1（前期我已经花了时间解决兼容问题了），然后又遇到个问题进行了几天搜索和排查，需要升到2.2.7。
今天因为一个Taro的bug，在Taro-UI（没错……隔壁遇到的bug，看issue里作者将Bug归属于Taro）提示到该问题用其他手法掩盖了，需要升级到v2.3.4。
然后把Taro-UI也从2.3.1升级了2.3.4 boom。
下边这样重装后，问题依旧：
rm package-lock.json yarn.lock
rm rf ./node_modules
rm -rf ~/.node-gyp/
yarn
太刺激了，一个坑开始一连串的坑。
我已经准备弃坑了……
我的源代码：https://github.com/54853315/weapp-MrsZhangPrivateKitchen
刚刚我用taro init test弄了个新项目：
54853315
on 25 Jun 2020
54853315
on 25 Jun 2020
按照 @54853315 添加了 sass 解析插件后确实能正确运行。
但是这样子感觉有点奇怪，我创建项目的时候选择的less，结果我还得配置一个sass才能运行。
yanguoyu
on 27 Jun 2020
按照 @54853315 添加了 sass 解析插件后确实能正确运行。
但是这样子感觉有点奇怪，我创建项目的时候选择的less，结果我还得配置一个sass才能运行。
是sass和less都需要单独安装，比如你用less，你就安装less。
我用sass，我就需要安装sass。
从2.2.8开始，taro默认只支持css。
这个公告的位置太隐蔽了，最Basic的“快速安装”里没有提到，偶然发现的……
54853315
on 27 Jun 2020
我用的 less , 但是 @Taro/Components 里面有 sass
yanguoyu
on 27 Jun 2020
我用的 less , 但是 @Taro/Components 里面有 sass
配置起来确实相当奇怪，
littcc
on 28 Jun 2020
我用的 less , 但是 @Taro/Components 里面有 sass
54853315
on 28 Jun 2020
今天试了一下，我将yarn环境升级到2.2.9，然后taro init test一个项目，在装好后，把package.json和config/index.js(webpack)copy到我原来的项目里，然后删除node_moulde，然后安装。
现在已经好了QAQ 我哭出了声，我感觉是2.2.7的依赖有问题啊～
以下是过程：
# 安装当前最新，即为2.2.9
yarn global add @tarojs/cli
# 创建一个测试用的项目
taro init test
#等待安装完毕后，运行确保没有问题
yarn dev:h5
# 将package.json config/index.js 覆盖掉你遇到问题的项目下的文件
rm -rf node_modules yarn.lock
yarn install
yarn dev:weapp
这样一套下来我不需要单独按照https://nervjs.github.io/taro/docs/styles-processor/ 中说的那样去安装sass，因为我在taro init 时指定了sass。
好颠………………
54853315
on 29 Jun 2020
出现Module parse failed: Unexpected character '@' (1:0)错误，在项目跟目录下执行命令：npm install @tarojs/plugin-sass 。
安装后重新npm run dev:h5就可以了。
KunCho
on 29 Jun 2020
同样的问题 Taro v2.2.9
预选less 就出现 Module parse failed: Unexpected character '@' (1:0)错误
运行 npm install @tarojs/plugin-less 后依然无效
预选sass 正常运行 npm run dev:h5
guan919
on 30 Jun 2020
同样的问题 Taro v2.2.9
预选less 就出现 Module parse failed: Unexpected character '@' (1:0)错误
运行 npm install @tarojs/plugin-less 后依然无效
预选sass 正常运行 npm run dev:h5
当前确实还存在该问题，可以先将 @tarojs/plugin-sass 也装上临时解决该问题
ZakaryCode
on 8 Jul 2020
taro 2.2.15. 出现此问题 可以将 @tarojs/plugin-sass 也装，然后在config/index.js中 plugins里面添加：@tarojs/plugin-sass
plugins: [
'@tarojs/plugin-sass',
'@tarojs/plugin-less',
'@tarojs/plugin-terser'
],
racall
on 19 Oct 2020
taro 2.2.15. 出现此问题 可以将 @tarojs/plugin-sass 也装，然后在config/index.js中 plugins里面添加：@tarojs/plugin-sass
plugins: [ '@tarojs/plugin-sass', '@tarojs/plugin-less', '@tarojs/plugin-terser' ],
未能复现，如尝试新版本依旧存在可以提交一个新的issue，并提供可复现的demo
ZakaryCode
on 20 Oct 2020
Related issues
XT-0515
·
3Comments
liuchuzhang
·
3Comments
rainbowMorelhahahah
·
3Comments
waahai
·
3Comments
zhuxianguo
·
3Comments
Most helpful comment
解决了没，
第一步，就遇到坑， 没想到，坑里还有水，水下藏着钉，钉子还有尖儿，