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

ES Modules + Prettier + FossilRecord class + node http-server + webpack dev source map #157

Open
wants to merge 5 commits into
base: develop
Choose a base branch
from

Conversation

balduvian
Copy link

@balduvian balduvian commented May 15, 2023

This pull request brings a few quality of life changes to the codebase while modernizing a few things.

The biggest change is that all source files now use the modern ES Module import and export system. This replaces the old require() of commonjs modules.

I have also added prettier for consistent code formatting and applied it to all files. A good IDE such as vscode should automatically apply prettier styling when you save a file. The configuration is in .prettierrc. If there are disagreements about what the specific code style should be, then it can be changed in there.

Originally I was going to add tests but decided against it. In the course of testing however I saw that the FossilRecord was not easily independently testable because it was a global object. There are many such global singleton objects in the project and in the future they should probably be turned into true classes and passed around or even just left as a singleton instance globally. In this PR FossilRecord is turned into a class and it is no longer global.

The setup instructions in the README suggest using python for hosting the local webserver. This is fine, but it is easier to just use the http-webserver package in node. I have added it to dev dependencies and added the script serve to the package.json. People don't have to install python for the local webserver anymore. Once they've ran npm install they can just run npm run serve to start the webserver.

Final thing, the old webpack.config didn't actually make it easier to debug when you run it in --mode=development. Now when you build in development mode it uses the source map devtool to give you complete access to the source in your browser's devtools. I also rewrote the webpack config in typescript to check its correctness (and to be able to use ES Module imports). In the future adding types to the whole project would be a worthy endeavor. Going through the code I found a few instances where variables were assigned to the incorrect type. These would've been caught if it was type checked.

@balduvian balduvian changed the base branch from master to develop May 15, 2023 07:01
@@ -1,3 +1,2 @@
node_modules/*
dist/js/bundle.js
./package-lock.json
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm fairly certain that you should not ignore the package lock

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants