would like to use Winston@3 package in our project. But I can't resolve problem with requered 'fs' package.
I always get this error:
Compiled with problems:
ERROR in ./node_modules/winston/dist/winston/tail-file.js 12:9-22
Module not found: Error: Can't resolve 'fs' in '/app/node_modules/winston/dist/winston'
ERROR in ./node_modules/winston/dist/winston/transports/file.js 136:9-22
Module not found: Error: Can't resolve 'fs' in '/app/node_modules/winston/dist/winston/transports'
I tried everything I found. Just like define browser restriction in package.json
:
{
...
"browser": {
"fs": false,
"path": false,
"os": false
},
"devDependencies": {
"@testing-library/vue": "^6.5.1",
"@types/applepayjs": "^3.0.4",
"@types/googlepay": "^0.6.4",
"@types/jest": "^27.5.2",
"@types/vue-i18n": "^7.0.0",
"@typescript-eslint/eslint-plugin": "^5.45.0",
"@typescript-eslint/parser": "^5.45.0",
"@vue/cli": "^5.0.4",
"@vue/cli-plugin-babel": "^5.0.4",
"@vue/cli-plugin-e2e-cypress": "^5.0.4",
"@vue/cli-plugin-eslint": "^5.0.8",
"@vue/cli-plugin-router": "^5.0.4",
"@vue/cli-plugin-typescript": "^5.0.4",
"@vue/cli-plugin-unit-jest": "^5.0.8",
"@vue/cli-plugin-vuex": "^5.0.4",
"@vue/cli-service": "^5.0.4",
"@vue/compiler-sfc": "^3.2.31",
"@vue/eslint-config-typescript": "^11.0.2",
"@vue/test-utils": "^2.2.4",
"@vue/vue3-jest": "^27.0.0",
"babel-eslint": "^10.1.0",
"babel-jest": "^27.5.1",
"cypress": "^11.2.0",
"eclint": "^2.8.1",
"eslint": "^8.28.0",
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-node": "^11.1.0",
"eslint-plugin-vue": "^9.8.0",
"identity-obj-proxy": "^3.0.0",
"jest": "^27.5.1",
"jest-runner-groups": "^2.2.0",
"less": "^4.1.3",
"less-loader": "^11.0.0",
"lint-staged": "^13.0.4",
"ts-jest": "^27.1.5",
"tsconfig-paths": "^4.1.1",
"tslib": "^2.3.1",
"typescript": "^4.9.3"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/vue3-essential",
"eslint:recommended",
"@vue/typescript",
"plugin:cypress/recommended"
],
"parserOptions": {
"parser": "@typescript-eslint/parser",
"ecmaVersion": 2021
},
"rules": {
"no-unused-vars": "off"
},
"overrides": [
{
"files": [
"**/__tests__/*.{j,t}s?(x)",
"**/tests/unit/**/*.test.{j,t}s?(x)"
],
"env": {
"jest": true
}
}
]
},
"browserslist": [
"> 0.1%",
"last 10 years",
"not dead",
"not ie 11"
],
...
}
Configure fs: 'empty'
in webpack.config.js
:
module.exports = {
resolve: {
extensions: ['.js', '.jsx', '.ts', '.tsx'],
fallback: {
util: require.resolve("util/"),
"fs": false
},
alias: {
fs: 'empty'
}
},
module: {
node: {
fs: 'empty'
}
},
};
and also configure fs: 'empty'
in vue.config.js
where i also configure the webpack:
module.exports = {
...
configureWebpack: {
plugins: [new NodePolyfillPlugin()],
resolve: {
alias: {
fs: 'empty'
}
}
},
chainWebpack: (config) => {
// config.node = {
// 'fs': 'empty'
// };
// config.node = {
// fs: 'empty'
// }
},
...
}
I also use TypeScript but I think that one is not causing this problem...
{
"compilerOptions": {
"target": "ESNext",
"module": "ESNext",
"strict": true,
"jsx": "preserve",
"importHelpers": true,
"moduleResolution": "node",
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"forceConsistentCasingInFileNames": true,
"useDefineForClassFields": true,
"allowJs": true,
"sourceMap": false,
"baseUrl": ".",
"types": [
"webpack-env",
"jest"
],
"paths": {
"@/tests/*": [
"./tests/*",
],
"@/*": [
"./src/*",
"./*"
],
"tslib" : ["bower_components/tslib/tslib.d.ts"]
},
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
]
},
"include": [
"./src/*.ts",
"./src/**/*.ts",
],
"exclude": [
"node_modules",
"dist",
"**/*.spec.ts",
"./tests/e2e.api.ts"
]
}
I have no idea how to fix this. I found a lot of instructions in the internet how to solve it but no one works for me. :(
Is here anyone who knows and can helps me? Thank you!