cat-a-logs 2.0.0 → 2.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +94 -33
- package/client/index.ts +0 -55
- package/package.json +6 -35
- package/snapshots/Catalog_art.png +0 -0
- package/.babelrc +0 -13
- package/bin/catalogExe.js +0 -4
- package/client/App.js +0 -1
- package/client/App.tsx +0 -0
- package/client/css/input.css +0 -3
- package/client/template.html +0 -18
- package/lambda-nodejs22.x/README.TOOLKIT.md +0 -38
- package/lambda-nodejs22.x/README.md +0 -127
- package/lambda-nodejs22.x/events/event.json +0 -62
- package/lambda-nodejs22.x/hello-world/app.mjs +0 -82
- package/lambda-nodejs22.x/hello-world/package.json +0 -25
- package/lambda-nodejs22.x/samconfig.toml +0 -31
- package/lambda-nodejs22.x/template.yaml +0 -41
- package/postcss.config.js +0 -7
- package/server/server.ts +0 -4
- package/tailwind.config.js +0 -12
- package/webpack.config.js +0 -79
package/README.md
CHANGED
|
@@ -1,47 +1,55 @@
|
|
|
1
|
-
#
|
|
2
|
-
This
|
|
1
|
+
# Welcome to Cat-A-Log!
|
|
2
|
+
This npm package will help you create AWS Embedded Metric Format Logs and publish them to AWS Cloudwatch using AWS Lambda Powertools. EMF formatting will allow for chosen metrics to be automatically visualized in Cloudwatch metrics for simplier log debugging.
|
|
3
3
|
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
For more information please visit the link below
|
|
4
|
+
<p align="center">
|
|
5
|
+
<img src="./snapshots/Catalog_art.png" width="200" />
|
|
6
|
+
</p>
|
|
8
7
|
|
|
8
|
+
|
|
9
|
+
## About Embedded Metric Formatting (EMF):
|
|
10
|
+
This is a JSON specification to communicate with Cloudwatch Logs to automatically extract values embedded in the structured log events. EMF is especially great for applications that make logs and need custom metrics without more complexity or cost. For more information please visit the following link:
|
|
9
11
|
<a href="https://docs.aws.amazon.com/AmazonCloudWatch/latest/monitoring/CloudWatch_Embedded_Metric_Format_Specification.html" target="_blank">AWS Documentation on EMF Formatting</a>
|
|
10
12
|
|
|
13
|
+
## Why use Cat-A-Log?
|
|
14
|
+
Why use a washing machine when you can do them by hand? Because it saves you time and makes your job way easier! Leveraging AWS Lambda Powertools we can use the cat-a-log function to invoke and format logs into AWS Embedded Metric Format. By publishing these logs to AWS Cloudwatch, we are able to provide engineers with automatic metric visulaization to make the process of debugging logs much more efficient. Cat-a-log utilizies a cache to make effcient work of sending logs to Cloudwatch.
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
## Instructions
|
|
18
|
+
**Prerequites:**
|
|
19
|
+
Your chosen Integated Development Environment (i.e. VS Code) must already be be connected to AWS Lambda. For more guidence on setting up AWS Lambda we recommend following this helpful tutorial from AWS: <a href="https://docs.aws.amazon.com/serverless-application-model/latest/developerguide/serverless-getting-started-hello-world.html" target="_blank">Deploy Hello World Application with AWS SAM</a>
|
|
11
20
|
|
|
12
|
-
**
|
|
13
|
-
|
|
21
|
+
**Installation:**
|
|
22
|
+
1. Install our package using the command `npm install cat-a-logs` then import the function and cache into your js file that connects to AWS Lambda `import { cache, catalog } from "cat-a-logs/index.js";` Check out Cat-A-Log on npm using the attached link:
|
|
23
|
+
<a href="https://www.npmjs.com/package/cat-a-logs?activeTab=readme" target="_blank">Cat-A-Log</a>
|
|
14
24
|
|
|
25
|
+
2. Now enter your arguments into the catalog function! Lets go through each argument one at a time and see what this looks like. First Lets take a look at the function definition:
|
|
15
26
|
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
27
|
+
```
|
|
28
|
+
function catalog(
|
|
29
|
+
trackedVariable: number | Array<number>,
|
|
30
|
+
metricName: string,
|
|
31
|
+
metricNamespace: string,
|
|
32
|
+
metricUnitLabel: string = "None",
|
|
33
|
+
CustomerDefinedDimension: { [key: string]: string } = {},
|
|
34
|
+
resolution: 1 | 60 = 60,
|
|
35
|
+
deploy: boolean = false)
|
|
36
|
+
```
|
|
19
37
|
|
|
20
|
-
|
|
38
|
+
- **trackedVariable**: This variable represents a number that is dynamic and can change with each call - these numbers are reflected under Metrics
|
|
39
|
+
- **metricName**: This is a unique label of the tracked variable that will be reflected inside AWS Lambda. Must be written as a `string`
|
|
40
|
+
- **metricNamespace**: This will be your metric namespace in AWS Cloudwatch the metric or metrics will appear in
|
|
41
|
+
- **metricUnitLabel**: Explict Unit that Cloudwatch uses for EMF Configuration. Please note - Can only be the following labels:
|
|
42
|
+
- Seconds | Microseconds | Milliseconds | Bytes | Kilobytes | Megabytes | Gigabytes | Terabytes | Bits | Kilobits | Megabits | Gigabits | Terabits | Percent | Count | Bytes/Second | Kilobytes/Second | Megabytes/Second | Gigabytes/Second | Terabytes/Second | Bits/Second | Kilobits/Second | Megabits/Second | Gigabits/Second | Terabits/Second | Count/Second | None
|
|
21
43
|
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
metricUnitLabel: string = "None",
|
|
27
|
-
CustomerDefinedDimension: { [key: string]: string } = {},
|
|
28
|
-
resolution: 1 | 60 = 60,
|
|
29
|
-
deploy: boolean = false
|
|
30
|
-
)`
|
|
44
|
+
- To read more about Metric Datum see this <a href="https://docs.aws.amazon.com/AmazonCloudWatch/latest/APIReference/API_MetricDatum.html" target="_blank">link</a>
|
|
45
|
+
- **CustomerDefinedDimension**: This is an object - key will be demension and value
|
|
46
|
+
- **resolution**: automatically set to default value
|
|
47
|
+
- **deploy**: automatically set to false
|
|
31
48
|
|
|
32
|
-
- **trackedVariable**: This is a number that is dynamic and can change with each call - these numbers are reflected
|
|
33
|
-
- **metricName**:
|
|
34
|
-
- **metricNamespace**:
|
|
35
|
-
- **metricUnitLabel**: Can only be the following labels:
|
|
36
|
-
- Seconds | Microseconds | Milliseconds | Bytes | Kilobytes | Megabytes | Gigabytes | Terabytes | Bits | Kilobits | Megabits | Gigabits | Terabits | Percent | Count | Bytes/Second | Kilobytes/Second | Megabytes/Second | Gigabytes/Second | Terabytes/Second | Bits/Second | Kilobits/Second | Megabits/Second | Gigabits/Second | Terabits/Second | Count/Second | None\
|
|
37
49
|
|
|
38
|
-
To read more about Metric Datum see this <a href="https://docs.aws.amazon.com/AmazonCloudWatch/latest/APIReference/API_MetricDatum.html" target="_blank">link</a>
|
|
39
|
-
- **CustomerDefinedDimension**:
|
|
40
|
-
- **resolution**:
|
|
41
|
-
- **deploy**:
|
|
42
50
|
|
|
43
|
-
|
|
44
|
-
|
|
51
|
+
## Notes to Self:
|
|
52
|
+
**Structure of the files:**
|
|
45
53
|
|
|
46
54
|
`index.ts` is compiled to `index.js`. Important to compile `.ts` file to es6 js syntax using the `tsc —target es6 (filepath)` command
|
|
47
55
|
`app.mjs ` is a "pathway" to our lambda function. Here is where we will import catalog function and use it to involke our lambda function
|
|
@@ -54,4 +62,57 @@ logger.info gives you some information level is key and value is info
|
|
|
54
62
|
if you write name that it will overwrite the keys
|
|
55
63
|
|
|
56
64
|
**Tech Challenges**
|
|
57
|
-
Spent 3 days dealing with inconsistencies of ES6/CommonJS in our code before compiling .js in ES6
|
|
65
|
+
Spent 3 days dealing with inconsistencies of ES6/CommonJS in our code before compiling .js in ES6
|
|
66
|
+
|
|
67
|
+
**Files to Delete**
|
|
68
|
+
App.js
|
|
69
|
+
App.tsx
|
|
70
|
+
tailwind.css?
|
|
71
|
+
tailwind.config.js
|
|
72
|
+
input.css?
|
|
73
|
+
postcss.config.js
|
|
74
|
+
server(folder)
|
|
75
|
+
coverage (folder)
|
|
76
|
+
bin (folder)
|
|
77
|
+
template.html
|
|
78
|
+
testlogger.js
|
|
79
|
+
|
|
80
|
+
-->webpack.config.js? **Test renaming to see if it breaks.
|
|
81
|
+
|
|
82
|
+
Package json:
|
|
83
|
+
"@babel/core": "^7.25.7",
|
|
84
|
+
"@babel/plugin-transform-runtime": "^7.25.7",
|
|
85
|
+
"@babel/preset-env": "^7.25.8",
|
|
86
|
+
"@babel/preset-react": "^7.25.7",
|
|
87
|
+
"@babel/runtime": "^7.25.7",
|
|
88
|
+
"babel-eslint": "^10.1.0",
|
|
89
|
+
"babel-loader": "^9.2.1",
|
|
90
|
+
"cross-env": "^7.0.3",
|
|
91
|
+
"css-loader": "^7.1.2",
|
|
92
|
+
"html-webpack-plugin": "^5.6.0",
|
|
93
|
+
"node-mocks-http": "^1.16.1",
|
|
94
|
+
"nodemon": "^3.1.7",
|
|
95
|
+
"postcss": "^8.4.49",
|
|
96
|
+
"postcss-loader": "^8.1.1",
|
|
97
|
+
"postcss-preset-env": "^10.1.1",
|
|
98
|
+
"sass": "^1.80.5",
|
|
99
|
+
"sass-loader": "^16.0.2",
|
|
100
|
+
"style-loader": "^4.0.0",
|
|
101
|
+
"tailwindcss": "^3.4.15",
|
|
102
|
+
"webpack": "^5.95.0",
|
|
103
|
+
"webpack-cli": "^5.1.4",
|
|
104
|
+
"webpack-dev-server": "^5.1.0"
|
|
105
|
+
"bcrypt": "^5.1.1",
|
|
106
|
+
"cookie-parser": "^1.4.7",
|
|
107
|
+
"cors": "^2.8.5",
|
|
108
|
+
"express": "^4.21.1",
|
|
109
|
+
"express-session": "^1.18.1",
|
|
110
|
+
"react": "^18.3.1",
|
|
111
|
+
"react-dom": "^18.3.1",
|
|
112
|
+
"react-router-dom": "^6.27.0"
|
|
113
|
+
|
|
114
|
+
**npmignore**
|
|
115
|
+
lambda-nodejs22.x
|
|
116
|
+
|
|
117
|
+
**gitignore**
|
|
118
|
+
lambda-nodejs22.x
|
package/client/index.ts
CHANGED
|
@@ -204,9 +204,7 @@ async function catalog(
|
|
|
204
204
|
// validate the new EMF JSON schema against AWS EMF JSON schema before adding to cache object
|
|
205
205
|
const isValid = validateEmf(newEmfLog);
|
|
206
206
|
// //troubleshooting console.error in test
|
|
207
|
-
// console.log('index.ts - Validation result: ', isValid);
|
|
208
207
|
// troubleshooting console.error in emf test
|
|
209
|
-
// console.log('index.ts - Validation errors: ', validateEmf.errors);
|
|
210
208
|
// if it fails validation throw error
|
|
211
209
|
if (!isValid) {
|
|
212
210
|
console.error(
|
|
@@ -236,56 +234,3 @@ async function catalog(
|
|
|
236
234
|
}
|
|
237
235
|
}
|
|
238
236
|
export { cache, catalog };
|
|
239
|
-
|
|
240
|
-
/*Current Working logger invocation
|
|
241
|
-
logger.info("Your EMF compliant Structured Metrics Log",
|
|
242
|
-
Object.assign({
|
|
243
|
-
_aws: {
|
|
244
|
-
Timestamp: Date.now(),
|
|
245
|
-
CloudWatchMetrics: [
|
|
246
|
-
{
|
|
247
|
-
Namespace: metricNamespace,
|
|
248
|
-
Dimensions: [Object.keys(CustomerDefinedDimension)],
|
|
249
|
-
Metrics: [
|
|
250
|
-
{
|
|
251
|
-
Name: metricName,
|
|
252
|
-
Unit: metricUnitLabel,
|
|
253
|
-
StorageResolution: resolution,
|
|
254
|
-
}
|
|
255
|
-
]
|
|
256
|
-
}
|
|
257
|
-
]
|
|
258
|
-
},
|
|
259
|
-
[`${metricName}`]: trackedVariable,
|
|
260
|
-
},
|
|
261
|
-
CustomerDefinedDimension
|
|
262
|
-
)
|
|
263
|
-
|
|
264
|
-
)
|
|
265
|
-
*/
|
|
266
|
-
|
|
267
|
-
//Old handler function
|
|
268
|
-
// export const handler = async (_event, _context): Promise<void> => {
|
|
269
|
-
// const testObj = {
|
|
270
|
-
// testguy: "hi",
|
|
271
|
-
// fool: 42,
|
|
272
|
-
// functionVersion: "$LATEST",
|
|
273
|
-
// _aws: {
|
|
274
|
-
// Timestamp: Date.now(),
|
|
275
|
-
// CloudWatchMetrics: [
|
|
276
|
-
// {
|
|
277
|
-
// Namespace: "lambda-function-metrics",
|
|
278
|
-
// Dimensions: [["functionVersion"]],
|
|
279
|
-
// Metrics: [
|
|
280
|
-
// {
|
|
281
|
-
// Name: "fool",
|
|
282
|
-
// Unit: "Milliseconds",
|
|
283
|
-
// StorageResolution: 60
|
|
284
|
-
// }
|
|
285
|
-
// ]
|
|
286
|
-
// }
|
|
287
|
-
// ]
|
|
288
|
-
// },
|
|
289
|
-
// }
|
|
290
|
-
// logger.info(JSON.stringify(testObj));
|
|
291
|
-
// };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "cat-a-logs",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.2",
|
|
4
4
|
"description": "Create & send structured logs to AWS Cloudwatch logs",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"exports":{
|
|
@@ -17,34 +17,13 @@
|
|
|
17
17
|
"license": "ISC",
|
|
18
18
|
"type": "module",
|
|
19
19
|
"devDependencies": {
|
|
20
|
-
"@babel/core": "^7.25.7",
|
|
21
|
-
"@babel/plugin-transform-runtime": "^7.25.7",
|
|
22
|
-
"@babel/preset-env": "^7.25.8",
|
|
23
|
-
"@babel/preset-react": "^7.25.7",
|
|
24
|
-
"@babel/runtime": "^7.25.7",
|
|
25
|
-
"@types/jest": "^29.5.14",
|
|
26
|
-
"babel-eslint": "^10.1.0",
|
|
27
|
-
"babel-loader": "^9.2.1",
|
|
28
|
-
"concurrently": "^9.0.1",
|
|
29
|
-
"cross-env": "^7.0.3",
|
|
30
|
-
"css-loader": "^7.1.2",
|
|
31
|
-
"html-webpack-plugin": "^5.6.0",
|
|
32
|
-
"jest": "^29.7.0",
|
|
33
|
-
"node-mocks-http": "^1.16.1",
|
|
34
|
-
"nodemon": "^3.1.7",
|
|
35
|
-
"postcss": "^8.4.49",
|
|
36
|
-
"postcss-loader": "^8.1.1",
|
|
37
|
-
"postcss-preset-env": "^10.1.1",
|
|
38
|
-
"sass": "^1.80.5",
|
|
39
|
-
"sass-loader": "^16.0.2",
|
|
40
|
-
"style-loader": "^4.0.0",
|
|
41
|
-
"tailwindcss": "^3.4.15",
|
|
42
20
|
"ts-jest": "^29.2.5",
|
|
43
21
|
"ts-loader": "^9.5.1",
|
|
44
22
|
"typescript": "^5.7.3",
|
|
45
|
-
"
|
|
46
|
-
"
|
|
47
|
-
"
|
|
23
|
+
"jest": "^29.7.0",
|
|
24
|
+
"@types/jest": "^29.5.14",
|
|
25
|
+
"concurrently": "^9.0.1",
|
|
26
|
+
"cross-env": "^7.0.3"
|
|
48
27
|
},
|
|
49
28
|
"dependencies": {
|
|
50
29
|
"@aws-lambda-powertools/logger": "^2.11.0",
|
|
@@ -54,16 +33,8 @@
|
|
|
54
33
|
"@testing-library/react": "^16.0.1",
|
|
55
34
|
"@testing-library/user-event": "^14.5.2",
|
|
56
35
|
"ajv": "^8.17.1",
|
|
57
|
-
"bcrypt": "^5.1.1",
|
|
58
|
-
"cookie-parser": "^1.4.7",
|
|
59
|
-
"cors": "^2.8.5",
|
|
60
|
-
"dotenv": "^16.4.7",
|
|
61
|
-
"express": "^4.21.1",
|
|
62
|
-
"express-session": "^1.18.1",
|
|
63
36
|
"jest-environment-jsdom": "^29.7.0",
|
|
64
37
|
"lambda-log": "^3.1.0",
|
|
65
|
-
"
|
|
66
|
-
"react-dom": "^18.3.1",
|
|
67
|
-
"react-router-dom": "^6.27.0"
|
|
38
|
+
"dotenv": "^16.4.7"
|
|
68
39
|
}
|
|
69
40
|
}
|
|
Binary file
|
package/.babelrc
DELETED
package/bin/catalogExe.js
DELETED
package/client/App.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";
|
package/client/App.tsx
DELETED
|
File without changes
|
package/client/css/input.css
DELETED
package/client/template.html
DELETED
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
<!-- Used by HTMLWebpackPlugin (per plugins config in webpack.config.js)
|
|
2
|
-
to build index.html with each webpack rebuild/rebundle -->
|
|
3
|
-
|
|
4
|
-
<!DOCTYPE html>
|
|
5
|
-
<html>
|
|
6
|
-
<head>
|
|
7
|
-
<meta charset="utf-8" />
|
|
8
|
-
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
9
|
-
<title>%= htmlWebpackPlugin.options.title %</title>
|
|
10
|
-
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
11
|
-
</head>
|
|
12
|
-
<body>
|
|
13
|
-
<h1 class="text-4xl text-blue-700">My Webpack + Tailwind App</h1>
|
|
14
|
-
<script src="dist/bundle.js"></script>
|
|
15
|
-
<!-- Insert React App here -->
|
|
16
|
-
<div id="root"></div>
|
|
17
|
-
</body>
|
|
18
|
-
</html>
|
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
# Developing AWS SAM Applications with the AWS Toolkit For Visual Studio Code
|
|
2
|
-
|
|
3
|
-
This project contains source code and supporting files for a serverless application that you can locally run, debug, and deploy to AWS with the AWS Toolkit For Visual Studio Code.
|
|
4
|
-
|
|
5
|
-
A "SAM" (serverless application model) project is a project that contains a template.yaml file which is understood by AWS tooling (such as SAM CLI, and the AWS Toolkit For Visual Studio Code).
|
|
6
|
-
|
|
7
|
-
## Writing and Debugging Serverless Applications
|
|
8
|
-
|
|
9
|
-
The code for this application will differ based on the runtime, but the path to a handler can be found in the [`template.yaml`](./template.yaml) file through a resource's `CodeUri` and `Handler` fields.
|
|
10
|
-
|
|
11
|
-
AWS Toolkit For Visual Studio Code supports local debugging for serverless applications through VS Code's debugger. Since this application was created by the AWS Toolkit, launch configurations for all included handlers have been generated and can be found in the menu next to the Run button:
|
|
12
|
-
|
|
13
|
-
* lambda-nodejs22.x:HelloWorldFunction (nodejs22.x)
|
|
14
|
-
* API lambda-nodejs22.x:HelloWorldFunction (nodejs22.x)
|
|
15
|
-
|
|
16
|
-
You can debug the Lambda handlers locally by adding a breakpoint to the source file, then running the launch configuration. This works by using Docker on your local machine.
|
|
17
|
-
|
|
18
|
-
Invocation parameters, including payloads and request parameters, can be edited either by the `Local Invoke and Debug Configuration` command (through the Command Palette or CodeLens) or by editing the `launch.json` file.
|
|
19
|
-
|
|
20
|
-
AWS Lambda functions not defined in the [`template.yaml`](./template.yaml) file can be invoked and debugged by creating a launch configuration through the CodeLens over the function declaration, or with the `Add Local Invoke and Debug Configuration` command.
|
|
21
|
-
|
|
22
|
-
## Deploying Serverless Applications
|
|
23
|
-
|
|
24
|
-
You can deploy a serverless application by invoking the `AWS: Deploy SAM application` command through the Command Palette or by right-clicking the Lambda node in the AWS Explorer and entering the deployment region, a valid S3 bucket from the region, and the name of a CloudFormation stack to deploy to. You can monitor your deployment's progress through the `AWS Toolkit` Output Channel.
|
|
25
|
-
|
|
26
|
-
## Interacting With Deployed Serverless Applications
|
|
27
|
-
|
|
28
|
-
A successfully-deployed serverless application can be found in the AWS Explorer under region and CloudFormation node that the serverless application was deployed to.
|
|
29
|
-
|
|
30
|
-
In the AWS Explorer, you can invoke _remote_ AWS Lambda Functions by right-clicking the Lambda node and selecting "Invoke on AWS".
|
|
31
|
-
|
|
32
|
-
Similarly, if the Function declaration contained an API Gateway event, the API Gateway API can be found in the API Gateway node under the region node the serverless application was deployed to, and can be invoked via right-clicking the API node and selecting "Invoke on AWS".
|
|
33
|
-
|
|
34
|
-
## Resources
|
|
35
|
-
|
|
36
|
-
General information about this SAM project can be found in the [`README.md`](./README.md) file in this folder.
|
|
37
|
-
|
|
38
|
-
More information about using the AWS Toolkit For Visual Studio Code with serverless applications can be found [in the AWS documentation](https://docs.aws.amazon.com/toolkit-for-vscode/latest/userguide/serverless-apps.html) .
|
|
@@ -1,127 +0,0 @@
|
|
|
1
|
-
# lambda-nodejs22.x
|
|
2
|
-
|
|
3
|
-
This project contains source code and supporting files for a serverless application that you can deploy with the SAM CLI. It includes the following files and folders.
|
|
4
|
-
|
|
5
|
-
- hello-world - Code for the application's Lambda function.
|
|
6
|
-
- events - Invocation events that you can use to invoke the function.
|
|
7
|
-
- hello-world/tests - Unit tests for the application code.
|
|
8
|
-
- template.yaml - A template that defines the application's AWS resources.
|
|
9
|
-
|
|
10
|
-
The application uses several AWS resources, including Lambda functions and an API Gateway API. These resources are defined in the `template.yaml` file in this project. You can update the template to add AWS resources through the same deployment process that updates your application code.
|
|
11
|
-
|
|
12
|
-
If you prefer to use an integrated development environment (IDE) to build and test your application, you can use the AWS Toolkit.
|
|
13
|
-
The AWS Toolkit is an open source plug-in for popular IDEs that uses the SAM CLI to build and deploy serverless applications on AWS. The AWS Toolkit also adds a simplified step-through debugging experience for Lambda function code. See the following links to get started.
|
|
14
|
-
|
|
15
|
-
* [CLion](https://docs.aws.amazon.com/toolkit-for-jetbrains/latest/userguide/welcome.html)
|
|
16
|
-
* [GoLand](https://docs.aws.amazon.com/toolkit-for-jetbrains/latest/userguide/welcome.html)
|
|
17
|
-
* [IntelliJ](https://docs.aws.amazon.com/toolkit-for-jetbrains/latest/userguide/welcome.html)
|
|
18
|
-
* [WebStorm](https://docs.aws.amazon.com/toolkit-for-jetbrains/latest/userguide/welcome.html)
|
|
19
|
-
* [Rider](https://docs.aws.amazon.com/toolkit-for-jetbrains/latest/userguide/welcome.html)
|
|
20
|
-
* [PhpStorm](https://docs.aws.amazon.com/toolkit-for-jetbrains/latest/userguide/welcome.html)
|
|
21
|
-
* [PyCharm](https://docs.aws.amazon.com/toolkit-for-jetbrains/latest/userguide/welcome.html)
|
|
22
|
-
* [RubyMine](https://docs.aws.amazon.com/toolkit-for-jetbrains/latest/userguide/welcome.html)
|
|
23
|
-
* [DataGrip](https://docs.aws.amazon.com/toolkit-for-jetbrains/latest/userguide/welcome.html)
|
|
24
|
-
* [VS Code](https://docs.aws.amazon.com/toolkit-for-vscode/latest/userguide/welcome.html)
|
|
25
|
-
* [Visual Studio](https://docs.aws.amazon.com/toolkit-for-visual-studio/latest/user-guide/welcome.html)
|
|
26
|
-
|
|
27
|
-
## Deploy the sample application
|
|
28
|
-
|
|
29
|
-
The Serverless Application Model Command Line Interface (SAM CLI) is an extension of the AWS CLI that adds functionality for building and testing Lambda applications. It uses Docker to run your functions in an Amazon Linux environment that matches Lambda. It can also emulate your application's build environment and API.
|
|
30
|
-
|
|
31
|
-
To use the SAM CLI, you need the following tools.
|
|
32
|
-
|
|
33
|
-
* SAM CLI - [Install the SAM CLI](https://docs.aws.amazon.com/serverless-application-model/latest/developerguide/serverless-sam-cli-install.html)
|
|
34
|
-
* Node.js - [Install Node.js 22](https://nodejs.org/en/), including the NPM package management tool.
|
|
35
|
-
* Docker - [Install Docker community edition](https://hub.docker.com/search/?type=edition&offering=community)
|
|
36
|
-
|
|
37
|
-
To build and deploy your application for the first time, run the following in your shell:
|
|
38
|
-
|
|
39
|
-
```bash
|
|
40
|
-
sam build
|
|
41
|
-
sam deploy --guided
|
|
42
|
-
```
|
|
43
|
-
|
|
44
|
-
The first command will build the source of your application. The second command will package and deploy your application to AWS, with a series of prompts:
|
|
45
|
-
|
|
46
|
-
* **Stack Name**: The name of the stack to deploy to CloudFormation. This should be unique to your account and region, and a good starting point would be something matching your project name.
|
|
47
|
-
* **AWS Region**: The AWS region you want to deploy your app to.
|
|
48
|
-
* **Confirm changes before deploy**: If set to yes, any change sets will be shown to you before execution for manual review. If set to no, the AWS SAM CLI will automatically deploy application changes.
|
|
49
|
-
* **Allow SAM CLI IAM role creation**: Many AWS SAM templates, including this example, create AWS IAM roles required for the AWS Lambda function(s) included to access AWS services. By default, these are scoped down to minimum required permissions. To deploy an AWS CloudFormation stack which creates or modifies IAM roles, the `CAPABILITY_IAM` value for `capabilities` must be provided. If permission isn't provided through this prompt, to deploy this example you must explicitly pass `--capabilities CAPABILITY_IAM` to the `sam deploy` command.
|
|
50
|
-
* **Save arguments to samconfig.toml**: If set to yes, your choices will be saved to a configuration file inside the project, so that in the future you can just re-run `sam deploy` without parameters to deploy changes to your application.
|
|
51
|
-
|
|
52
|
-
You can find your API Gateway Endpoint URL in the output values displayed after deployment.
|
|
53
|
-
|
|
54
|
-
## Use the SAM CLI to build and test locally
|
|
55
|
-
|
|
56
|
-
Build your application with the `sam build` command.
|
|
57
|
-
|
|
58
|
-
```bash
|
|
59
|
-
lambda-nodejs22.x$ sam build
|
|
60
|
-
```
|
|
61
|
-
|
|
62
|
-
The SAM CLI installs dependencies defined in `hello-world/package.json`, creates a deployment package, and saves it in the `.aws-sam/build` folder.
|
|
63
|
-
|
|
64
|
-
Test a single function by invoking it directly with a test event. An event is a JSON document that represents the input that the function receives from the event source. Test events are included in the `events` folder in this project.
|
|
65
|
-
|
|
66
|
-
Run functions locally and invoke them with the `sam local invoke` command.
|
|
67
|
-
|
|
68
|
-
```bash
|
|
69
|
-
lambda-nodejs22.x$ sam local invoke HelloWorldFunction --event events/event.json
|
|
70
|
-
```
|
|
71
|
-
|
|
72
|
-
The SAM CLI can also emulate your application's API. Use the `sam local start-api` to run the API locally on port 3000.
|
|
73
|
-
|
|
74
|
-
```bash
|
|
75
|
-
lambda-nodejs22.x$ sam local start-api
|
|
76
|
-
lambda-nodejs22.x$ curl http://localhost:3000/
|
|
77
|
-
```
|
|
78
|
-
|
|
79
|
-
The SAM CLI reads the application template to determine the API's routes and the functions that they invoke. The `Events` property on each function's definition includes the route and method for each path.
|
|
80
|
-
|
|
81
|
-
```yaml
|
|
82
|
-
Events:
|
|
83
|
-
HelloWorld:
|
|
84
|
-
Type: Api
|
|
85
|
-
Properties:
|
|
86
|
-
Path: /hello
|
|
87
|
-
Method: get
|
|
88
|
-
```
|
|
89
|
-
|
|
90
|
-
## Add a resource to your application
|
|
91
|
-
The application template uses AWS Serverless Application Model (AWS SAM) to define application resources. AWS SAM is an extension of AWS CloudFormation with a simpler syntax for configuring common serverless application resources such as functions, triggers, and APIs. For resources not included in [the SAM specification](https://github.com/awslabs/serverless-application-model/blob/master/versions/2016-10-31.md), you can use standard [AWS CloudFormation](https://docs.aws.amazon.com/AWSCloudFormation/latest/UserGuide/aws-template-resource-type-ref.html) resource types.
|
|
92
|
-
|
|
93
|
-
## Fetch, tail, and filter Lambda function logs
|
|
94
|
-
|
|
95
|
-
To simplify troubleshooting, SAM CLI has a command called `sam logs`. `sam logs` lets you fetch logs generated by your deployed Lambda function from the command line. In addition to printing the logs on the terminal, this command has several nifty features to help you quickly find the bug.
|
|
96
|
-
|
|
97
|
-
`NOTE`: This command works for all AWS Lambda functions; not just the ones you deploy using SAM.
|
|
98
|
-
|
|
99
|
-
```bash
|
|
100
|
-
lambda-nodejs22.x$ sam logs -n HelloWorldFunction --stack-name lambda-nodejs22.x --tail
|
|
101
|
-
```
|
|
102
|
-
|
|
103
|
-
You can find more information and examples about filtering Lambda function logs in the [SAM CLI Documentation](https://docs.aws.amazon.com/serverless-application-model/latest/developerguide/serverless-sam-cli-logging.html).
|
|
104
|
-
|
|
105
|
-
## Unit tests
|
|
106
|
-
|
|
107
|
-
Tests are defined in the `hello-world/tests` folder in this project. Use NPM to install the [Mocha test framework](https://mochajs.org/) and run unit tests.
|
|
108
|
-
|
|
109
|
-
```bash
|
|
110
|
-
lambda-nodejs22.x$ cd hello-world
|
|
111
|
-
hello-world$ npm install
|
|
112
|
-
hello-world$ npm run test
|
|
113
|
-
```
|
|
114
|
-
|
|
115
|
-
## Cleanup
|
|
116
|
-
|
|
117
|
-
To delete the sample application that you created, use the AWS CLI. Assuming you used your project name for the stack name, you can run the following:
|
|
118
|
-
|
|
119
|
-
```bash
|
|
120
|
-
sam delete --stack-name lambda-nodejs22.x
|
|
121
|
-
```
|
|
122
|
-
|
|
123
|
-
## Resources
|
|
124
|
-
|
|
125
|
-
See the [AWS SAM developer guide](https://docs.aws.amazon.com/serverless-application-model/latest/developerguide/what-is-sam.html) for an introduction to SAM specification, the SAM CLI, and serverless application concepts.
|
|
126
|
-
|
|
127
|
-
Next, you can use AWS Serverless Application Repository to deploy ready to use Apps that go beyond hello world samples and learn how authors developed their applications: [AWS Serverless Application Repository main page](https://aws.amazon.com/serverless/serverlessrepo/)
|
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"body": "{\"message\": \"hello world\"}",
|
|
3
|
-
"resource": "/{proxy+}",
|
|
4
|
-
"path": "/path/to/resource",
|
|
5
|
-
"httpMethod": "POST",
|
|
6
|
-
"isBase64Encoded": false,
|
|
7
|
-
"queryStringParameters": {
|
|
8
|
-
"foo": "bar"
|
|
9
|
-
},
|
|
10
|
-
"pathParameters": {
|
|
11
|
-
"proxy": "/path/to/resource"
|
|
12
|
-
},
|
|
13
|
-
"stageVariables": {
|
|
14
|
-
"baz": "qux"
|
|
15
|
-
},
|
|
16
|
-
"headers": {
|
|
17
|
-
"Accept": "text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8",
|
|
18
|
-
"Accept-Encoding": "gzip, deflate, sdch",
|
|
19
|
-
"Accept-Language": "en-US,en;q=0.8",
|
|
20
|
-
"Cache-Control": "max-age=0",
|
|
21
|
-
"CloudFront-Forwarded-Proto": "https",
|
|
22
|
-
"CloudFront-Is-Desktop-Viewer": "true",
|
|
23
|
-
"CloudFront-Is-Mobile-Viewer": "false",
|
|
24
|
-
"CloudFront-Is-SmartTV-Viewer": "false",
|
|
25
|
-
"CloudFront-Is-Tablet-Viewer": "false",
|
|
26
|
-
"CloudFront-Viewer-Country": "US",
|
|
27
|
-
"Host": "1234567890.execute-api.us-east-1.amazonaws.com",
|
|
28
|
-
"Upgrade-Insecure-Requests": "1",
|
|
29
|
-
"User-Agent": "Custom User Agent String",
|
|
30
|
-
"Via": "1.1 08f323deadbeefa7af34d5feb414ce27.cloudfront.net (CloudFront)",
|
|
31
|
-
"X-Amz-Cf-Id": "cDehVQoZnx43VYQb9j2-nvCh-9z396Uhbp027Y2JvkCPNLmGJHqlaA==",
|
|
32
|
-
"X-Forwarded-For": "127.0.0.1, 127.0.0.2",
|
|
33
|
-
"X-Forwarded-Port": "443",
|
|
34
|
-
"X-Forwarded-Proto": "https"
|
|
35
|
-
},
|
|
36
|
-
"requestContext": {
|
|
37
|
-
"accountId": "123456789012",
|
|
38
|
-
"resourceId": "123456",
|
|
39
|
-
"stage": "prod",
|
|
40
|
-
"requestId": "c6af9ac6-7b61-11e6-9a41-93e8deadbeef",
|
|
41
|
-
"requestTime": "09/Apr/2015:12:34:56 +0000",
|
|
42
|
-
"requestTimeEpoch": 1428582896000,
|
|
43
|
-
"identity": {
|
|
44
|
-
"cognitoIdentityPoolId": null,
|
|
45
|
-
"accountId": null,
|
|
46
|
-
"cognitoIdentityId": null,
|
|
47
|
-
"caller": null,
|
|
48
|
-
"accessKey": null,
|
|
49
|
-
"sourceIp": "127.0.0.1",
|
|
50
|
-
"cognitoAuthenticationType": null,
|
|
51
|
-
"cognitoAuthenticationProvider": null,
|
|
52
|
-
"userArn": null,
|
|
53
|
-
"userAgent": "Custom User Agent String",
|
|
54
|
-
"user": null
|
|
55
|
-
},
|
|
56
|
-
"path": "/prod/path/to/resource",
|
|
57
|
-
"resourcePath": "/{proxy+}",
|
|
58
|
-
"httpMethod": "POST",
|
|
59
|
-
"apiId": "1234567890",
|
|
60
|
-
"protocol": "HTTP/1.1"
|
|
61
|
-
}
|
|
62
|
-
}
|
|
@@ -1,82 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
*
|
|
3
|
-
* Event doc: https://docs.aws.amazon.com/apigateway/latest/developerguide/set-up-lambda-proxy-integrations.html#api-gateway-simple-proxy-for-lambda-input-format
|
|
4
|
-
* @param {Object} event - API Gateway Lambda Proxy Input Format
|
|
5
|
-
*
|
|
6
|
-
* Context doc: https://docs.aws.amazon.com/lambda/latest/dg/nodejs-prog-model-context.html
|
|
7
|
-
* @param {Object} context
|
|
8
|
-
*
|
|
9
|
-
* Return doc: https://docs.aws.amazon.com/apigateway/latest/developerguide/set-up-lambda-proxy-integrations.html
|
|
10
|
-
* @returns {Object} object - API Gateway Lambda Proxy Output Format
|
|
11
|
-
*
|
|
12
|
-
*/
|
|
13
|
-
|
|
14
|
-
import { Logger } from '@aws-lambda-powertools/logger';
|
|
15
|
-
const logger = new Logger({ serviceName: 'serverlessAirline' });
|
|
16
|
-
import Ajv from 'ajv';
|
|
17
|
-
import {cache, catalog} from "cats-a-logs/index.js";
|
|
18
|
-
|
|
19
|
-
export const lambdaHandler = async (event, context) => {
|
|
20
|
-
const response = {
|
|
21
|
-
statusCode: 200,
|
|
22
|
-
body: JSON.stringify({
|
|
23
|
-
message: 'hello world',
|
|
24
|
-
}),
|
|
25
|
-
};
|
|
26
|
-
let kilos = Math.ceil(Math.random()*70);
|
|
27
|
-
let pounds =Math.ceil(Math.random()*35);
|
|
28
|
-
let grams = Math.ceil(Math.random()*20);
|
|
29
|
-
catalog(pounds, 'poundsTest', 'lambda-junction-metrics2', 'None', {
|
|
30
|
-
functionVersion: '$LATEST',
|
|
31
|
-
testDimension: 'berp',
|
|
32
|
-
});
|
|
33
|
-
catalog(grams, 'randomTest', 'lambda-junction-metrics2', 'Count', {
|
|
34
|
-
testDimension: 'berp',
|
|
35
|
-
functionVersion: '$LATEST',
|
|
36
|
-
});
|
|
37
|
-
// catalog(kilos, 'level', 'lambda-junction-metrics2');
|
|
38
|
-
catalog(
|
|
39
|
-
kilos,
|
|
40
|
-
'Weight',
|
|
41
|
-
'lambda-junction-metrics2',
|
|
42
|
-
'None',
|
|
43
|
-
{ functionVersion: '$LATEST', testDimension: 'berp' },
|
|
44
|
-
60,
|
|
45
|
-
true
|
|
46
|
-
);
|
|
47
|
-
|
|
48
|
-
//catalog(pounds, "testLogger2" , "lambda-function-metrics", Milliseconds, {'functionVersion': $LATEST, 'testDimension': derp});
|
|
49
|
-
|
|
50
|
-
//catalog(trackedVariable: var, metricName: string , metricNamespace: string, metricUnitLabel: string, CustomerDefinedDimension(s): Object {DimensionName: DimensionValue: String, ...}, ...);
|
|
51
|
-
|
|
52
|
-
// logger.info('testEMF using logger.info', {
|
|
53
|
-
// testguy: "hi",
|
|
54
|
-
// kilos: 54,
|
|
55
|
-
// testLogger2: 34,
|
|
56
|
-
// functionVersion: "$LATEST",
|
|
57
|
-
// testDimension: "derp",
|
|
58
|
-
// _aws: {
|
|
59
|
-
// Timestamp: Date.now(),
|
|
60
|
-
// CloudWatchMetrics: [
|
|
61
|
-
// {
|
|
62
|
-
// Namespace: "lambda-function-metrics",
|
|
63
|
-
// Dimensions: [["functionVersion", "testDimension"]],
|
|
64
|
-
// Metrics: [
|
|
65
|
-
// {
|
|
66
|
-
// Name: "kilos",
|
|
67
|
-
// Unit: "Kilograms",
|
|
68
|
-
// StorageResolution: 60
|
|
69
|
-
// },
|
|
70
|
-
// {
|
|
71
|
-
// Name: "testLogger2",
|
|
72
|
-
// Unit: "Milliseconds",
|
|
73
|
-
// StorageResolution: 60
|
|
74
|
-
// }
|
|
75
|
-
// ]
|
|
76
|
-
// }
|
|
77
|
-
// ]
|
|
78
|
-
// },
|
|
79
|
-
// });
|
|
80
|
-
|
|
81
|
-
return response;
|
|
82
|
-
};
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "hello_world",
|
|
3
|
-
"version": "1.0.0",
|
|
4
|
-
"description": "hello world sample for NodeJS",
|
|
5
|
-
"main": "app.js",
|
|
6
|
-
"repository": "https://github.com/awslabs/aws-sam-cli/tree/develop/samcli/local/init/templates/cookiecutter-aws-sam-hello-nodejs",
|
|
7
|
-
"author": "SAM CLI",
|
|
8
|
-
"license": "MIT",
|
|
9
|
-
"dependencies": {
|
|
10
|
-
"axios": ">=1.6.0",
|
|
11
|
-
"@aws-lambda-powertools/logger": "^2.11.0",
|
|
12
|
-
"@aws-lambda-powertools/metrics": "^2.11.0",
|
|
13
|
-
"lambda-log": "^3.1.0",
|
|
14
|
-
"ajv": "^8.17.1",
|
|
15
|
-
"cats-a-logs": "^1.0.1"
|
|
16
|
-
},
|
|
17
|
-
"scripts": {
|
|
18
|
-
"test": "mocha tests/unit/"
|
|
19
|
-
},
|
|
20
|
-
"devDependencies": {
|
|
21
|
-
"chai": "^4.3.6",
|
|
22
|
-
"mocha": "^10.2.0"
|
|
23
|
-
|
|
24
|
-
}
|
|
25
|
-
}
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
version = 0.1
|
|
2
|
-
|
|
3
|
-
[default.global.parameters]
|
|
4
|
-
stack_name = "catalog-dev-v1"
|
|
5
|
-
region = "us-east-2"
|
|
6
|
-
|
|
7
|
-
[default.build.parameters]
|
|
8
|
-
cached = true
|
|
9
|
-
parallel = true
|
|
10
|
-
|
|
11
|
-
[default.validate.parameters]
|
|
12
|
-
lint = true
|
|
13
|
-
|
|
14
|
-
[default.deploy.parameters]
|
|
15
|
-
capabilities = "CAPABILITY_IAM"
|
|
16
|
-
confirm_changeset = true
|
|
17
|
-
resolve_s3 = true
|
|
18
|
-
|
|
19
|
-
[default.package.parameters]
|
|
20
|
-
resolve_s3 = true
|
|
21
|
-
|
|
22
|
-
[default.sync.parameters]
|
|
23
|
-
watch = true
|
|
24
|
-
template_file = "/Users/clara/code/codesmith/cat-a-log/lambda-nodejs22.x/template.yaml"
|
|
25
|
-
dependency_layer = false
|
|
26
|
-
|
|
27
|
-
[default.local_start_api.parameters]
|
|
28
|
-
warm_containers = "EAGER"
|
|
29
|
-
|
|
30
|
-
[default.local_start_lambda.parameters]
|
|
31
|
-
warm_containers = "EAGER"
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
AWSTemplateFormatVersion: '2010-09-09'
|
|
2
|
-
Transform: AWS::Serverless-2016-10-31
|
|
3
|
-
Description: >
|
|
4
|
-
lambda-nodejs22.x
|
|
5
|
-
|
|
6
|
-
Sample SAM Template for lambda-nodejs22.x
|
|
7
|
-
|
|
8
|
-
# More info about Globals: https://github.com/awslabs/serverless-application-model/blob/master/docs/globals.rst
|
|
9
|
-
Globals:
|
|
10
|
-
Function:
|
|
11
|
-
Timeout: 3
|
|
12
|
-
|
|
13
|
-
Resources:
|
|
14
|
-
HelloWorldFunction:
|
|
15
|
-
Type: AWS::Serverless::Function # More info about Function Resource: https://github.com/awslabs/serverless-application-model/blob/master/versions/2016-10-31.md#awsserverlessfunction
|
|
16
|
-
Properties:
|
|
17
|
-
CodeUri: hello-world/
|
|
18
|
-
Handler: app.lambdaHandler
|
|
19
|
-
Runtime: nodejs22.x
|
|
20
|
-
Architectures:
|
|
21
|
-
- x86_64
|
|
22
|
-
Events:
|
|
23
|
-
HelloWorld:
|
|
24
|
-
Type: Api # More info about API Event Source: https://github.com/awslabs/serverless-application-model/blob/master/versions/2016-10-31.md#api
|
|
25
|
-
Properties:
|
|
26
|
-
Path: /hello
|
|
27
|
-
Method: get
|
|
28
|
-
|
|
29
|
-
Outputs:
|
|
30
|
-
# ServerlessRestApi is an implicit API created out of Events key under Serverless::Function
|
|
31
|
-
# Find out more about other implicit resources you can reference within SAM
|
|
32
|
-
# https://github.com/awslabs/serverless-application-model/blob/master/docs/internals/generated_resources.rst#api
|
|
33
|
-
HelloWorldApi:
|
|
34
|
-
Description: "API Gateway endpoint URL for Prod stage for Hello World function"
|
|
35
|
-
Value: !Sub "https://${ServerlessRestApi}.execute-api.${AWS::Region}.amazonaws.com/Prod/hello/"
|
|
36
|
-
HelloWorldFunction:
|
|
37
|
-
Description: "Hello World Lambda Function ARN"
|
|
38
|
-
Value: !GetAtt HelloWorldFunction.Arn
|
|
39
|
-
HelloWorldFunctionIamRole:
|
|
40
|
-
Description: "Implicit IAM Role created for Hello World function"
|
|
41
|
-
Value: !GetAtt HelloWorldFunctionRole.Arn
|
package/postcss.config.js
DELETED
package/server/server.ts
DELETED
package/tailwind.config.js
DELETED
package/webpack.config.js
DELETED
|
@@ -1,79 +0,0 @@
|
|
|
1
|
-
const path = require('path');
|
|
2
|
-
const HtmlWebpackPlugin = require('html-webpack-plugin');
|
|
3
|
-
// const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
|
|
4
|
-
|
|
5
|
-
module.exports = {
|
|
6
|
-
mode: 'development',
|
|
7
|
-
entry: {
|
|
8
|
-
bundle: path.resolve(__dirname, 'client/index.ts'), // Entry point name is 'bundle'
|
|
9
|
-
},
|
|
10
|
-
output: {
|
|
11
|
-
path: path.resolve(__dirname, 'dist'),
|
|
12
|
-
filename: '[name][contenthash].js', // Filename template for JS bundles. Assigns bundle to [name], [contenthash] appends a unique hash to each rebuild of bundle.
|
|
13
|
-
clean: true, // Cleans old files in the output directory before each build
|
|
14
|
-
assetModuleFilename: '[name][ext]', // Template for assets file names & their file extensions
|
|
15
|
-
},
|
|
16
|
-
//maps from bundle to source creating bundle.map file. Apparently helpful for debugging w/in the bundle...?
|
|
17
|
-
devtool: 'source-map',
|
|
18
|
-
devServer: {
|
|
19
|
-
static: {
|
|
20
|
-
directory: path.resolve(__dirname, 'dist'), // serve static files from 'dist'
|
|
21
|
-
},
|
|
22
|
-
//changed from 3000 to 8080
|
|
23
|
-
port: 8080,
|
|
24
|
-
open: true, // Automatically opens browser when server starts
|
|
25
|
-
hot: true, // Enables Hot Module Replacement (HMR) w/out reloading/refreshing the whole page
|
|
26
|
-
compress: true,
|
|
27
|
-
historyApiFallback: true, //unknown routes redirect user to index.html..?
|
|
28
|
-
},
|
|
29
|
-
// Enable importing JS / JSX files without specifying their extension
|
|
30
|
-
resolve: {
|
|
31
|
-
extensions: ['.js', '.jsx', '.json', '.ts', '.tsx'],
|
|
32
|
-
},
|
|
33
|
-
module: {
|
|
34
|
-
rules: [
|
|
35
|
-
{
|
|
36
|
-
test: /\.ts?$/,
|
|
37
|
-
use: 'ts-loader',
|
|
38
|
-
exclude: /node_modules/,////// TODO: POTENTIAL PROBLEM
|
|
39
|
-
},
|
|
40
|
-
{
|
|
41
|
-
test: /\.scss$/,
|
|
42
|
-
use: ['style-loader', 'css-loader', 'sass-loader'],
|
|
43
|
-
},
|
|
44
|
-
{ test: /\.css$/,
|
|
45
|
-
use: ['style-loader', 'css-loader', 'postcss-loader'] },
|
|
46
|
-
{
|
|
47
|
-
test: /\.(png|svg|jpg|jpeg|gif)$/i,
|
|
48
|
-
type: 'asset/resource',
|
|
49
|
-
},
|
|
50
|
-
{
|
|
51
|
-
test: /\.(js|jsx)$/,
|
|
52
|
-
exclude: /node_modules/,
|
|
53
|
-
use: {
|
|
54
|
-
loader: 'babel-loader',
|
|
55
|
-
// options: {
|
|
56
|
-
// //presets are defined in my .babelrc file including preset for react
|
|
57
|
-
// presets: ['@babel/preset-env']
|
|
58
|
-
// },
|
|
59
|
-
},
|
|
60
|
-
},
|
|
61
|
-
{
|
|
62
|
-
//for being able to load images
|
|
63
|
-
test: /\.(png|svg|jpg|jpeg|gif)$/i,
|
|
64
|
-
type: 'asset/resource',
|
|
65
|
-
},
|
|
66
|
-
],
|
|
67
|
-
},
|
|
68
|
-
// resolve: {
|
|
69
|
-
// extensions: ['.js', '.jsx'],
|
|
70
|
-
// },
|
|
71
|
-
plugins: [
|
|
72
|
-
new HtmlWebpackPlugin({
|
|
73
|
-
title: 'Cat-A-Log',
|
|
74
|
-
filename: 'index.html',
|
|
75
|
-
template: 'client/template.html', //relative path of template.html
|
|
76
|
-
}),
|
|
77
|
-
// new BundleAnalyzerPlugin(),
|
|
78
|
-
],
|
|
79
|
-
};
|