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