Skip to content

Commit c6a4f48

Browse files
niaikoniaiko
committed
first commit
0 parents  commit c6a4f48

File tree

242 files changed

+67361
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

242 files changed

+67361
-0
lines changed

‎.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
node_modules

‎README.md

+45
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
# Vendure Angular Storefront
2+
3+
This is an e-commerce storefront application which is designed to be used with the [Vendure ecommerce framework](https://github.com/vendure-ecommerce/vendure) as a back end.
4+
5+
It is a progressive web application (PWA) which also uses Angular Universal for server-side rendering.
6+
7+
The app is built with the [Angular CLI](https://github.com/angular/angular-cli), with the data layer being handled by [Apollo Client](https://github.com/apollographql/apollo-client).
8+
9+
## Development
10+
11+
0. Clone this repo
12+
1. Run `npm install` or `yarn` in the root dir
13+
2. Run `npm start` or `yarn start` to build in development mode.
14+
3. Make sure you have a local Vendure instance running a `http://localhost:3000`.
15+
4. Open `http://localhost:4201` to see the storefront app running.
16+
17+
## Code generation
18+
19+
This project uses [graphql-code-generator](https://www.graphql-code-generator.com/) to generate TypeScript types based on the Vendure GraphQL API. To update the types, first change the `schema` property of [codegen.yml](./codegen.yml) to point to your local Vendure server, and then run the `generate-types` npm script.
20+
21+
## Deployment
22+
23+
To deploy this storefront in a production environment, take the following steps:
24+
25+
1. Open the [environment.prod.ts file](./src/environments/environment.prod.ts) and change the values to match your deployed Vendure server. You also probably want to set the `baseHref` value to `'/'` rather than `'/storefront/'`.
26+
2. Open the [angular.json file](./angular.json) and set the baseHref values to point to root:
27+
```diff
28+
"production": {
29+
- "baseHref": "/storefront/",
30+
- "deployUrl": "/storefront/",
31+
+ "baseHref": "/",
32+
+ "deployUrl": "/",
33+
```
34+
3. You then need to build for production using the `build:ssr` npm script. This can be done either locally or on your production server, depending on your preferred workflow.
35+
4. The built artifacts will be found in the `dist/` directory. The command to run the storefront as a server-rendered app is `node dist/server/main.js`. This will start a node server running on port 4000. You should configure your webserver to pass requests arriving on port 80 to `localhost:4000`.
36+
37+
### Building for demo.vendure.io
38+
39+
This project is used in the [Vendure Demo](https://github.com/vendure-ecommerce/vendure-demo). There is a [GitHub Actions workflow](./.github/workflows/build.yml) which is triggered whenever a new tag is added. The tag should be of the format `"vX.Y.Z"`. The workflow will run the `build:ssr` script and upload the compiled output to an Amazon S3 bucket, from which the vendure-demo project will pull the artifacts.
40+
41+
## License
42+
43+
MIT
44+
45+

‎angular.json

+224
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,224 @@
1+
{
2+
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
3+
"version": 1,
4+
"newProjectRoot": "projects",
5+
"projects": {
6+
"reference-storefront": {
7+
"root": "",
8+
"sourceRoot": "src",
9+
"projectType": "application",
10+
"prefix": "vsf",
11+
"schematics": {},
12+
"architect": {
13+
"build": {
14+
"builder": "@angular-devkit/build-angular:browser",
15+
"options": {
16+
"outputPath": "dist/browser",
17+
"index": "src/index.html",
18+
"main": "src/main.ts",
19+
"polyfills": "src/polyfills.ts",
20+
"tsConfig": "src/tsconfig.app.json",
21+
"assets": [
22+
"src/favicon.ico",
23+
"src/robots.txt",
24+
"src/assets",
25+
"src/storefront-config.json",
26+
"src/manifest.json",
27+
{
28+
"glob": "**/*",
29+
"input": "./node_modules/photoswipe/dist/default-skin",
30+
"output": "./assets"
31+
}
32+
],
33+
"styles": [
34+
"src/styles/styles.scss"
35+
],
36+
"scripts": [],
37+
"stylePreprocessorOptions": {
38+
"includePaths": [
39+
"src/styles",
40+
"dist"
41+
]
42+
},
43+
"vendorChunk": true,
44+
"extractLicenses": false,
45+
"buildOptimizer": false,
46+
"sourceMap": true,
47+
"optimization": false,
48+
"namedChunks": true
49+
},
50+
"configurations": {
51+
"production": {
52+
"baseHref": "/storefront/",
53+
"deployUrl": "/storefront/",
54+
"budgets": [
55+
{
56+
"type": "anyComponentStyle",
57+
"maximumWarning": "6kb"
58+
}
59+
],
60+
"fileReplacements": [
61+
{
62+
"replace": "src/environments/environment.ts",
63+
"with": "src/environments/environment.prod.ts"
64+
}
65+
],
66+
"optimization": true,
67+
"outputHashing": "all",
68+
"sourceMap": false,
69+
"namedChunks": false,
70+
"extractLicenses": true,
71+
"vendorChunk": false,
72+
"buildOptimizer": true,
73+
"serviceWorker": true
74+
},
75+
"docker": {
76+
"baseHref": "/",
77+
"deployUrl": "/",
78+
"fileReplacements": [
79+
{
80+
"replace": "src/environments/environment.ts",
81+
"with": "src/environments/environment.docker.ts"
82+
}
83+
]
84+
}
85+
}
86+
},
87+
"serve": {
88+
"builder": "@angular-devkit/build-angular:dev-server",
89+
"options": {
90+
"browserTarget": "reference-storefront:build"
91+
},
92+
"configurations": {
93+
"production": {
94+
"browserTarget": "reference-storefront:build:production"
95+
}
96+
}
97+
},
98+
"extract-i18n": {
99+
"builder": "@angular-devkit/build-angular:extract-i18n",
100+
"options": {
101+
"browserTarget": "reference-storefront:build"
102+
}
103+
},
104+
"test": {
105+
"builder": "@angular-devkit/build-angular:karma",
106+
"options": {
107+
"main": "src/test.ts",
108+
"polyfills": "src/polyfills.ts",
109+
"tsConfig": "src/tsconfig.spec.json",
110+
"karmaConfig": "src/karma.conf.js",
111+
"styles": [
112+
"src/styles/styles.scss"
113+
],
114+
"scripts": [],
115+
"assets": [
116+
"src/favicon.ico",
117+
"src/assets",
118+
"src/manifest.json"
119+
]
120+
}
121+
},
122+
"lint": {
123+
"builder": "@angular-devkit/build-angular:tslint",
124+
"options": {
125+
"tsConfig": [
126+
"src/tsconfig.app.json",
127+
"src/tsconfig.spec.json"
128+
],
129+
"exclude": [
130+
"**/node_modules/**"
131+
]
132+
}
133+
},
134+
"server": {
135+
"builder": "@angular-devkit/build-angular:server",
136+
"options": {
137+
"outputPath": "dist/server",
138+
"main": "server.ts",
139+
"tsConfig": "src/tsconfig.server.json",
140+
"stylePreprocessorOptions": {
141+
"includePaths": [
142+
"src/styles",
143+
"dist"
144+
]
145+
},
146+
"optimization": false
147+
},
148+
"configurations": {
149+
"production": {
150+
"fileReplacements": [
151+
{
152+
"replace": "src/environments/environment.ts",
153+
"with": "src/environments/environment.prod.ts"
154+
}
155+
],
156+
"optimization": true
157+
},
158+
"docker": {
159+
"fileReplacements": [
160+
{
161+
"replace": "src/environments/environment.ts",
162+
"with": "src/environments/environment.docker.ts"
163+
}
164+
],
165+
"optimization": true
166+
}
167+
}
168+
},
169+
"serve-ssr": {
170+
"builder": "@nguniversal/builders:ssr-dev-server",
171+
"options": {
172+
"browserTarget": "reference-storefront:build",
173+
"serverTarget": "reference-storefront:server"
174+
},
175+
"configurations": {
176+
"production": {
177+
"browserTarget": "reference-storefront:build:production",
178+
"serverTarget": "reference-storefront:server:production"
179+
}
180+
}
181+
},
182+
"prerender": {
183+
"builder": "@nguniversal/builders:prerender",
184+
"options": {
185+
"browserTarget": "reference-storefront:build:production",
186+
"serverTarget": "reference-storefront:server:production",
187+
"routes": [
188+
"/"
189+
]
190+
},
191+
"configurations": {
192+
"production": {}
193+
}
194+
}
195+
}
196+
}
197+
},
198+
"defaultProject": "reference-storefront",
199+
"schematics": {
200+
"@schematics/angular:component": {
201+
"style": "scss",
202+
"skipTests": true,
203+
"changeDetection": "OnPush"
204+
},
205+
"@schematics/angular:directive": {
206+
"skipTests": true
207+
},
208+
"@schematics/angular:modules": {
209+
"skipTests": true
210+
},
211+
"@schematics/angular:pipe": {
212+
"skipTests": true
213+
},
214+
"@schematics/angular:service": {
215+
"skipTests": true
216+
},
217+
"@schematics/angular:class": {
218+
"skipTests": true
219+
}
220+
},
221+
"cli": {
222+
"analytics": "85a41c1c-a523-42a4-a574-852fdd82e49c"
223+
}
224+
}

‎codegen.yml

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
overwrite: true
2+
schema: "./schema.graphql"
3+
documents: "./src/app/**/*.graphql.ts"
4+
generates:
5+
./src/app/common/generated-types.ts:
6+
plugins:
7+
- add:
8+
content: "// tslint:disable"
9+
- "typescript"
10+
- "typescript-compatibility"
11+
- "typescript-operations"
12+
config:
13+
namingConvention:
14+
enumValues: 'keep'
15+
maybeValue: 'T'
16+
strict: true
17+
./src/app/common/introspection-results.ts:
18+
plugins:
19+
- add:
20+
content: "// tslint:disable"
21+
- "fragment-matcher"
22+
config:
23+
apolloClientVersion: 3

‎ngsw-config.json

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
{
2+
"index": "/index.html",
3+
"assetGroups": [
4+
{
5+
"name": "app",
6+
"installMode": "prefetch",
7+
"resources": {
8+
"files": [
9+
"/favicon.ico",
10+
"/index.html",
11+
"/*.css",
12+
"/*.js"
13+
]
14+
}
15+
}, {
16+
"name": "assets",
17+
"installMode": "lazy",
18+
"updateMode": "prefetch",
19+
"resources": {
20+
"files": [
21+
"/assets/**",
22+
"/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
23+
]
24+
}
25+
}
26+
]
27+
}

0 commit comments

Comments
 (0)