Skip to content
This repository was archived by the owner on Oct 21, 2022. It is now read-only.

Commit 08c1099

Browse files
aattolaaattola
committed
✨ Initial commit
0 parents  commit 08c1099

36 files changed

+13244
-0
lines changed

‎.gitignore

Lines changed: 210 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,210 @@
1+
### JetBrains template
2+
# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio, WebStorm and Rider
3+
# Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839
4+
5+
# User-specific stuff
6+
.idea/**/workspace.xml
7+
.idea/**/tasks.xml
8+
.idea/**/usage.statistics.xml
9+
.idea/**/dictionaries
10+
.idea/**/shelf
11+
12+
# Generated files
13+
.idea/**/contentModel.xml
14+
15+
# Sensitive or high-churn files
16+
.idea/**/dataSources/
17+
.idea/**/dataSources.ids
18+
.idea/**/dataSources.local.xml
19+
.idea/**/sqlDataSources.xml
20+
.idea/**/dynamic.xml
21+
.idea/**/uiDesigner.xml
22+
.idea/**/dbnavigator.xml
23+
24+
# Gradle
25+
.idea/**/gradle.xml
26+
.idea/**/libraries
27+
28+
# Gradle and Maven with auto-import
29+
# When using Gradle or Maven with auto-import, you should exclude module files,
30+
# since they will be recreated, and may cause churn. Uncomment if using
31+
# auto-import.
32+
# .idea/artifacts
33+
# .idea/compiler.xml
34+
# .idea/jarRepositories.xml
35+
# .idea/modules.xml
36+
# .idea/*.iml
37+
# .idea/modules
38+
# *.iml
39+
# *.ipr
40+
41+
# CMake
42+
cmake-build-*/
43+
44+
# Mongo Explorer plugin
45+
.idea/**/mongoSettings.xml
46+
47+
# File-based project format
48+
*.iws
49+
50+
# IntelliJ
51+
out/
52+
53+
# mpeltonen/sbt-idea plugin
54+
.idea_modules/
55+
56+
# JIRA plugin
57+
atlassian-ide-plugin.xml
58+
59+
# Cursive Clojure plugin
60+
.idea/replstate.xml
61+
62+
# Crashlytics plugin (for Android Studio and IntelliJ)
63+
com_crashlytics_export_strings.xml
64+
crashlytics.properties
65+
crashlytics-build.properties
66+
fabric.properties
67+
68+
# Editor-based Rest Client
69+
.idea/httpRequests
70+
71+
# Android studio 3.1+ serialized cache file
72+
.idea/caches/build_file_checksums.ser
73+
74+
### Node template
75+
# Logs
76+
logs
77+
*.log
78+
npm-debug.log*
79+
yarn-debug.log*
80+
yarn-error.log*
81+
lerna-debug.log*
82+
83+
# Diagnostic reports (https://nodejs.org/api/report.html)
84+
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
85+
86+
# Runtime data
87+
pids
88+
*.pid
89+
*.seed
90+
*.pid.lock
91+
92+
# Directory for instrumented libs generated by jscoverage/JSCover
93+
lib-cov
94+
95+
# Coverage directory used by tools like istanbul
96+
coverage
97+
*.lcov
98+
99+
# nyc test coverage
100+
.nyc_output
101+
102+
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
103+
.grunt
104+
105+
# Bower dependency directory (https://bower.io/)
106+
bower_components
107+
108+
# node-waf configuration
109+
.lock-wscript
110+
111+
# Compiled binary addons (https://nodejs.org/api/addons.html)
112+
build/Release
113+
114+
# Dependency directories
115+
node_modules/
116+
jspm_packages/
117+
118+
# Snowpack dependency directory (https://snowpack.dev/)
119+
web_modules/
120+
121+
# TypeScript cache
122+
*.tsbuildinfo
123+
124+
# Optional npm cache directory
125+
.npm
126+
127+
# Optional eslint cache
128+
.eslintcache
129+
130+
# Microbundle cache
131+
.rpt2_cache/
132+
.rts2_cache_cjs/
133+
.rts2_cache_es/
134+
.rts2_cache_umd/
135+
136+
# Optional REPL history
137+
.node_repl_history
138+
139+
# Output of 'npm pack'
140+
*.tgz
141+
142+
# Yarn Integrity file
143+
.yarn-integrity
144+
145+
# dotenv environment variables file
146+
.env
147+
.env.test
148+
149+
# parcel-bundler cache (https://parceljs.org/)
150+
.cache
151+
.parcel-cache
152+
153+
# Next.js build output
154+
.next
155+
out
156+
157+
# Nuxt.js build / generate output
158+
.nuxt
159+
dist
160+
161+
# Gatsby files
162+
.cache/
163+
# Comment in the public line in if your project uses Gatsby and not Next.js
164+
# https://nextjs.org/blog/next-9-1#public-directory-support
165+
# public
166+
167+
# vuepress build output
168+
.vuepress/dist
169+
170+
# Serverless directories
171+
.serverless/
172+
173+
# FuseBox cache
174+
.fusebox/
175+
176+
# DynamoDB Local files
177+
.dynamodb/
178+
179+
# TernJS port file
180+
.tern-port
181+
182+
# Stores VSCode versions used for testing VSCode extensions
183+
.vscode-test
184+
185+
# yarn v2
186+
.yarn/cache
187+
.yarn/unplugged
188+
.yarn/build-state.yml
189+
.yarn/install-state.gz
190+
.pnp.*
191+
192+
.yarn/*
193+
!.yarn/patches
194+
!.yarn/releases
195+
!.yarn/plugins
196+
!.yarn/sdks
197+
!.yarn/versions
198+
.pnp.*
199+
200+
*/.yarn/*
201+
202+
203+
# custom
204+
205+
client/node_modules
206+
client/dist
207+
208+
ui/dist
209+
ui/build
210+

‎.yarn.installed

Whitespace-only changes.

‎LICENSE

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
Copyright (c) 2021 JEFFe
2+
3+
Permission is hereby granted, free of charge, to any person obtaining a copy
4+
of this software and associated documentation files (the "Software"), to deal
5+
in the Software without restriction, including without limitation the rights
6+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7+
copies of the Software, and to permit persons to whom the Software is
8+
furnished to do so, subject to the following conditions:
9+
10+
The above copyright notice and this permission notice shall be included in all
11+
copies or substantial portions of the Software.
12+
13+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
14+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
15+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
16+
IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
17+
DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR
18+
OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE
19+
OR OTHER DEALINGS IN THE SOFTWARE.

‎README.md

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
# FiveM React Typescript Eslint Boilerplate
2+
3+
Boilerplate for [FiveM](https://fivem.net/) with [React](https://reactjs.org/) [Typescript](https://www.typescriptlang.org/) [Eslint](https://eslint.org/) using [Classic Yarn](https://classic.yarnpkg.com/lang/en/) workspaces.
4+
5+
Includes Eslint for client server and ui with typechecking.
6+
7+
8+
## Requirements
9+
* Brains
10+
* [Yarn](https://classic.yarnpkg.com/lang/en/)
11+
* Basic understanding of web development with react and some understanding of fivem resources.
12+
* Basic idea of [yarn workspaces](https://classic.yarnpkg.com/en/docs/workspaces/)
13+
14+
## How to use
15+
1. Download this repo and extract
16+
2. Rename folder to something great and innovative
17+
3. Place folder to your Cfx server resources folder
18+
4. Add `ensure your_resource_name_here` to your server.cfg
19+
5. `yarn install` in root of the project
20+
6. Start making content using commands listed below
21+
22+
## Development
23+
24+
``yarn watch:ui`` Launches web browser with UI. You can also develop in game with this mode.
25+
26+
``yarn watch:client`` Starts watching for changes in client and rebuilds on change. Works also in game.
27+
28+
``yarn watch:server`` Starts watching for changes in server and rebuilds on change. Works also in game.
29+
30+
## Building
31+
32+
``yarn build``
33+
34+
**NOTE:** This command will give out error code 1. Even if the build was success. If the last lines read: "File sizes after gzip:" then the build was success.
35+
36+
37+
## Acknowledgements
38+
39+
React utils are from Project Error. You can read more about the utils at [Project Error react boilerplate](https://github.com/project-error/fivem-react-boilerplate-lua)

‎client/.eslintrc.json

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
{
2+
"env": {
3+
"es2021": true,
4+
"node": true
5+
},
6+
"settings": {
7+
"import/resolver": {
8+
"typescript": {}
9+
}
10+
},
11+
"extends": [
12+
"airbnb-base",
13+
"plugin:@typescript-eslint/recommended"
14+
],
15+
"parser": "@typescript-eslint/parser",
16+
"parserOptions": {
17+
"ecmaVersion": 12,
18+
"sourceType": "module"
19+
},
20+
"plugins": [
21+
"@typescript-eslint"
22+
],
23+
"rules": {
24+
"no-console": "off",
25+
"import/no-mutable-exports": "off",
26+
"@typescript-eslint/ban-ts-comment": "off",
27+
"import/extensions": [
28+
"error",
29+
"ignorePackages",
30+
{
31+
"ts": "never",
32+
"tsx": "never"
33+
}
34+
]
35+
}
36+
}

‎client/.yarnrc.yml

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
2+
packageExtensions:
3+
webpack-dev-server@*:
4+
peerDependencies:
5+
webpack-cli: "*"

‎client/package.json

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
{
2+
"name": "@app/client",
3+
"version": "1.0.0",
4+
"scripts": {
5+
"build": "webpack --mode development --color --progress",
6+
"watch": "webpack --mode development --watch"
7+
},
8+
"dependencies": {
9+
"@app/shared": "^1.0.0",
10+
"fivem-js": "^1.5.2"
11+
},
12+
"devDependencies": {
13+
"@citizenfx/client": "^2.0.4517-1",
14+
"@types/node": "^16.9.1",
15+
"@typescript-eslint/parser": "^4.31.1",
16+
"eslint": "^7.32.0",
17+
"eslint-config-airbnb-base": "^14.2.1",
18+
"eslint-import-resolver-typescript": "^2.5.0",
19+
"eslint-plugin-import": "^2.22.1",
20+
"remove-files-webpack-plugin": "^1.4.5",
21+
"ts-loader": "^9.2.5",
22+
"webpack": "^5.52.1",
23+
"webpack-cli": "^4.8.0"
24+
}
25+
}

‎client/src/client.ts

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
// import * as Cfx from 'fivem-js';
2+
3+
let nuiOpen = false;
4+
5+
function toggleNuiFrame(toggle: boolean) {
6+
SetNuiFocus(toggle, toggle);
7+
SendNUIMessage({
8+
action: 'setVisible',
9+
data: toggle,
10+
});
11+
}
12+
13+
RegisterCommand('toggleui', (source: any, args: any) => {
14+
console.log('Opening ui');
15+
nuiOpen = !nuiOpen;
16+
17+
toggleNuiFrame(nuiOpen);
18+
}, false);
19+
20+
RegisterNuiCallbackType('hideFrame');
21+
on('__cfx_nui:hideFrame', (_: any, cb: (returnData: any) => void) => {
22+
nuiOpen = !nuiOpen;
23+
toggleNuiFrame(false);
24+
cb({ ok: true });
25+
});

‎client/tsconfig.json

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"compilerOptions": {
3+
"baseUrl": ".",
4+
"paths": {
5+
"*": ["types/*"]
6+
},
7+
"outDir": "./dist",
8+
"noImplicitAny": true,
9+
"module": "commonjs",
10+
"target": "es6",
11+
"allowJs": true,
12+
"lib": ["es2017"],
13+
"types": ["@citizenfx/client", "@types/node"],
14+
"moduleResolution": "node",
15+
"resolveJsonModule": true,
16+
"esModuleInterop": true
17+
},
18+
"include": ["./src/**/*"],
19+
"exclude": ["**/node_modules", "**/__tests__/*"]
20+
}

0 commit comments

Comments
 (0)