Template Webpack

👉 Introduction

This template provides a solid foundation for modern JavaScript development, streamlining your workflow with a powerful combination of tools. It leverages Webpack for efficient bundling and optimization of your assets, ensuring top-notch performance. Integrated within this setup are ESLint for maintaining code quality and catching potential errors, Prettier for enforcing a consistent and clean code style, and Babel for transpiling your JavaScript code to ensure compatibility across different browsers. This pre-configured environment saves you valuable time and effort, allowing you to focus on building your application's core logic rather than wrestling with complex configurations. It's an ideal starting point for projects of any size, offering a robust and scalable architecture from the get-go.

💻 Installation

To install Template Webpack, follow these steps:

1. Clone the repository: git clone https://github.com/Big-Plato/template-webpack.git
2. Navigate to the project directory: cd template webpack
3. Install dependencies: npm install
4. Build the project: npm run build
5. Start the project: npm run dev

🔩 Tools

▶ Usage

To use template-webpack, follow these steps:

1. Open the project in your favorite code editor.

2. Modify the source code to fit your needs.

3. Build the project: npm run build

4. Start the project: npm run dev

5. Configure eslint to fit your project npm init @eslint/config@latest

6. To run eslint you can do npm run config /path/to/js ( change /path/to/js to the file or folder you want to lint)

7. When everything is right the dependencies in package.json will be like this:

   "devDependencies": {
    "@babel/core": "^7.26.9",
    "@babel/preset-env": "^7.26.9",
    "@eslint/js": "^9.20.0",
    "babel-loader": "^9.2.1",
    "css-loader": "^7.1.2",
    "eslint": "^8.57.1",
    "globals": "^16.0.0",
    "html-loader": "^5.1.0",
    "html-webpack-plugin": "^5.6.3",
    "prettier": "3.5.1",
    "style-loader": "^4.0.0",
    "webpack": "^5.98.0",
    "webpack-cli": "^6.0.1",
    "webpack-dev-server": "^5.2.0"
   },

8. in /src/ there are templates for main html, css and javascript files.

9. Use the project as desired.

🧑‍🤝‍🧑 Contributing

If you'd like to contribute to 'Template Webpack', here are some guidelines:

1. Fork the repository.
2. Create a new branch for your changes.
3. Make your changes.
4. Write tests to cover your changes.
5. Run the tests to ensure they pass.
6. Commit your changes.
7. Push your changes to your forked repository.
8. Submit a pull request.

📖 License

Template Webpack is released under the MIT License. See the LICENSE file for details.

🙋 Authors and Acknowledgment

Template Webpack was created by Luis Octávio.

☎ Contact

If you have any questions or comments about this template, please contact Luis Octávio.