nutui-react官网3.x版首页内容是H5版本的

[holyfata]

NutUI React 包名

@nutui/nutui-react-taro

NutUI React 版本号

3.0.17

平台

h5

重现链接

https://nutui.jd.com/taro/react/3x/#/zh-CN/guide/intro-react

重现步骤

官网 https://nutui.jd.com/taro/react/3x/#/zh-CN/guide/intro-react

期望的结果是什么？

内容是小程序版本的

实际的结果是什么？

内容是H5版本的

环境信息

No response

其他补充信息

No response

[Loongle]

难怪我为什么跟着教程走，死活跑不出来。有没有临时的指导文档？

[holyfata]

你切成2.x版本的小程序文档试试，我简单看了下安装方法应该差不多

[Loongle]

文档过时了，提到用的@import 语法有问题，会导致编译失败

[holyfata]

稍等，我整理一个临时能用的

[holyfata]

你是用的vite吧

[Loongle]

不是，换了webpack。

[Loongle]

另外，这些语法也是有问题的。应当使用把 @import 换成 @use 就能编译成功

[holyfata]

我用vite已经配置成功啦，稍等一会

[Loongle]

能否同步至文档？以免后来者踩坑，真的很考验心态

[holyfata]

1. 安装 @nutui/nutui-react-taro
2. app.ts 引入 '@nutui/nutui-react-taro/dist/styles/themes/default.css'
3. 安装 vite-plugin-imp
4. index.ts 配置vite和sass

compiler: {
  type: 'vite',
  vitePlugins: [
    vitePluginImp({
      libList: [
        {
          libName: '@nutui/nutui-react-taro',
          style: (name) => {
            // 默认主题
            // 按需引入 css 文件的处理，两种方式择其一
            return `@nutui/nutui-react-taro/dist/es/packages/${name.toLowerCase()}/style/style.css`
          },
          replaceOldImport: false,
          camel2DashComponentName: false,
        },
      ],
    })
  ]
},
sass: {
  resource: ['node_modules/@nutui/nutui-react-taro/dist/styles/variables.scss']
},

[holyfata]

https://github.com/holyfata/issues_reproduction/tree/master/taro_issue_3320_2 工程在这里

[Loongle]

我在跟着你的步骤实现。稍等

[Loongle]

npm run dev:alipay 执行会出错：

build started...
transforming (53) node_modules/@tarojs/api/dist/interceptor/index.jsDeprecation Warning [legacy-js-api]: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.

More info: https://sass-lang.com/d/legacy-js-api

transforming (66) node_modules/@tarojs/plugin-platform-alipay/dist/components-react.jsDeprecation Warning [legacy-js-api]: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.

More info: https://sass-lang.com/d/legacy-js-api

✓ 101 modules transformed.
/Users/loongle/Projects/yoofast/read-meter-management/node_modules/@tarojs/vite-runner/dist/mini/emit.js:188
                                    if (chunk.type === 'asset') {
                                              ^

TypeError: Cannot read properties of undefined (reading 'type')

[Loongle]

npm run dev:weapp 是没有这个问题。我换成webpack 后执行 npm run dev:alipay 是没有问题