Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

craco changes the output content of the package file to package the original configuration file and own custom folder #514

Open
TaoistYG opened this issue May 24, 2023 · 1 comment
Assignees
Labels
bug Something isn't working

Comments

@TaoistYG
Copy link

What's happening
Hello, When I use craco to change the package file name and static resource directory,The packaging generates not only the original default build file, but also my own custom folder,The default build file is a file directory after deployment, and dist is a normal file

What should happen
I want to package to generate only custom folders and directories

To reproduce
npm i @craco/craco -D
npm run build

CRACO version
(ex. 7.1.0)

CRACO config

const path = require('path');
const addPath = dir => path.join(__dirname, dir);
const { whenProd } = require('@craco/craco')

const webpackConfig = {
    webpack: {
        alias: {
            "@": addPath("src"),
        },
        configure: (webpackConfig, { env, paths }) => {
            path.appBuild = 'dist'; 
            webpackConfig.output = {
                ...webpackConfig.output,
                path: path.resolve(__dirname, 'dist'), 
                publicPath: '/',
            }
            webpackConfig.output.path = path.resolve(__dirname, 'dist');
            return webpackConfig;
        }
    },
    babel: {
        plugins: [
            // ['import', { libraryName: 'antd', style: true}],  
        ]
    }
}

module.exports = webpackConfig;

package.json

"dependencies": {
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "@types/jest": "^27.5.2",
    "@types/node": "^16.18.14",
    "@types/nprogress": "^0.2.0",
    "@types/react": "^18.0.28",
    "@types/react-dom": "^18.0.11",
    "@types/react-router-dom": "^5.3.3",
    "antd": "^5.3.1",
    "axios": "^1.3.4",
    "mobx": "^6.8.0",
    "mobx-react": "^7.6.0",
    "nprogress": "^0.2.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-router-dom": "^6.8.2",
    "react-scripts": "5.0.1",
    "typescript": "^4.9.5",
 },
"scripts": {
    "start": "craco start",
    "build": "craco build",
    "test": "craco test",
    "eject": "react-scripts eject"
 },
"devDependencies": {
    "@babel/plugin-proposal-decorators": "^7.21.0",
    "@craco/craco": "^7.1.0",
    "babel-plugin-import": "^1.13.6"
 }

Additional information
I think it may be a problem between react- Script 5.x and Craco 7.x

@TaoistYG TaoistYG added the bug Something isn't working label May 24, 2023
@stevenewald stevenewald self-assigned this May 25, 2023
@Hau-Do
Copy link

Hau-Do commented Aug 20, 2024

If you want to only generate only your own custom folder without generating /build folder as default, then you only need to adjust this line of code : paths.appBuild = webpackConfig.output.path;

Details as below:

const webpackConfig = {
    webpack: {
        alias: {
            "@": addPath("src"),
        },
        configure: (webpackConfig, { env, paths }) => {
            webpackConfig.output = {
                ...webpackConfig.output,
                path: path.resolve(__dirname, './dist/'), 
                publicPath: '/',
            }
            paths.appBuild = webpackConfig.output.path;
            return webpackConfig;
        }
    },
    babel: {
        plugins: [
            // ['import', { libraryName: 'antd', style: true}],  
        ]
    }
}

module.exports = webpackConfig;

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

3 participants