Can't make Linear Gradient RN to work

[trigonometric-act]

I installed react-native-linear-gradient in the mobile package json and react-native-web-linear-gradient into next js folder and modified next.config.js like this: module.exports = withTM({ webpack(config) { config.resolve.alias = { ...(config.resolve.alias || {}), 'react-native$': 'react-native-web', 'react-native-linear-gradient': 'react-native-web-linear-gradient', } config.resolve.extensions = [ '.web.js', '.web.ts', '.web.tsx', '.tsx', '.ts', '.js', ...config.resolve.extensions, ] return config }, })

I get the following error:

nextrn\node_modules\react-native-linear-gradient\index.js:1 import { Platform } from "react-native"; ^^^^^^

SyntaxError: Cannot use import statement outside a module at wrapSafe (internal/modules/cjs/loader.js:988:16) at Module._compile (internal/modules/cjs/loader.js:1036:27) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10) at Module.load (internal/modules/cjs/loader.js:937:32) at Function.Module._load (internal/modules/cjs/loader.js:778:12)
at Module.require (internal/modules/cjs/loader.js:961:19) at require (internal/modules/cjs/helpers.js:92:18) at Object.react-native-linear-gradient (C:\Users\guill\OneDrive\Documentos\GitHub\nextrn\packages\web-nextjs.next\server\pages\index.js:407:18)
at webpack_require (C:\Users\guill\OneDrive\Documentos\GitHub\nextrn\packages\web-nextjs.next\server\pages\index.js:23:31) at Module.../components/src/AppHeader.web.tsx (C:\Users\guill\OneDrive\Documentos\GitHub\nextrn\packages\web-nextjs.next\server\pages\index.js:334:86)

[trigonometric-act]

Solved by installing both dependencies in components directory.

[trigonometric-act]

Suddenly react-native-linear-gradient stopped working again is intalled in components directory with react-native-web-linear-gradient next config:

const withTM = require('next-transpile-modules')(['components' ], { resolveSymlinks: true, })

module.exports = withTM({ webpack(config) { config.resolve.alias = { ...(config.resolve.alias || {}), 'react-native$': 'react-native-web', 'react-native': 'react-native-web', 'react-native-linear-gradient': 'react-native-web-linear-gradient', }, config.resolve.extensions = [ '.web.js', '.web.ts', '.web.tsx', '.tsx', '.ts', '.js', ...config.resolve.extensions, ] return config }, })

I also would like help with oblador/react-native-vector-icons, I don't know how to configurate it properly with next js. Thank you