/
default.ts
204 lines (180 loc) · 5.71 KB
/
default.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
import path from "path";
import { CustomGenerator } from "../types";
const templatePath = path.resolve(__dirname, "../../init-template/default");
const resolveFile = (file: string): string => {
return path.resolve(templatePath, file);
};
/**
* Asks questions to the user used to modify generation
* @param self Generator values
* @param Question Contains questions
*/
export async function questions(
self: CustomGenerator,
// eslint-disable-next-line @typescript-eslint/no-explicit-any
Question: Record<string, any>,
): Promise<void> {
// Handle JS language solutions
const { langType } = await Question.List(
self,
"langType",
"Which of the following JS solutions do you want to use?",
["none", "ES6", "Typescript"],
"none",
self.force,
);
switch (langType) {
case "ES6":
self.dependencies = [
...self.dependencies,
"babel-loader",
"@babel/core",
"@babel/preset-env",
];
break;
case "Typescript":
self.dependencies = [...self.dependencies, "typescript", "ts-loader"];
break;
}
// Configure devServer configuraion
const { devServer } = await Question.Confirm(
self,
"devServer",
"Do you want to use webpack-dev-server?",
true,
self.force,
);
if (devServer) {
self.dependencies = [...self.dependencies, "webpack-dev-server"];
}
// Handle addition of html-webpack-plugin
const { htmlWebpackPlugin } = await Question.Confirm(
self,
"htmlWebpackPlugin",
"Do you want to simplify the creation of HTML files for your bundle?",
true,
self.force,
);
if (htmlWebpackPlugin) {
self.dependencies = [...self.dependencies, "html-webpack-plugin"];
}
// Store all answers for generation
self.answers = { ...self.answers, langType, devServer, htmlWebpackPlugin };
// Handle CSS solutions
const { cssType } = await Question.List(
self,
"cssType",
"Which of the following CSS solutions do you want to use?",
["none", "CSS only", "SASS", "LESS", "Stylus"],
"none",
self.force,
);
if (cssType == "none") {
self.answers = {
...self.answers,
cssType,
isCSS: false,
isPostCSS: false,
extractPlugin: "No",
};
return;
}
const { isCSS } =
cssType != "CSS only"
? await Question.Confirm(
self,
"isCSS",
`Will you be using CSS styles along with ${cssType} in your project?`,
true,
self.force,
)
: { isCSS: true };
const { isPostCSS } = await Question.Confirm(
self,
"isPostCSS",
"Will you be using PostCSS in your project?",
cssType == "CSS only",
self.force,
);
const { extractPlugin } = await Question.List(
self,
"extractPlugin",
"Do you want to extract CSS for every file?",
["No", "Only for Production", "Yes"],
"No",
self.force,
);
switch (cssType) {
case "SASS":
self.dependencies = [...self.dependencies, "sass-loader", "sass"];
break;
case "LESS":
self.dependencies = [...self.dependencies, "less-loader", "less"];
break;
case "Stylus":
self.dependencies = [...self.dependencies, "stylus-loader", "stylus"];
break;
}
if (isCSS) {
self.dependencies = [...self.dependencies, "style-loader", "css-loader"];
}
if (isPostCSS) {
self.dependencies = [...self.dependencies, "postcss-loader", "postcss", "autoprefixer"];
}
if (extractPlugin !== "No") {
self.dependencies = [...self.dependencies, "mini-css-extract-plugin"];
}
self.answers = {
...self.answers,
cssType,
isCSS,
isPostCSS,
extractPlugin,
};
}
/**
* Handles generation of project files
* @param self Generator values
*/
export function generate(self: CustomGenerator): void {
self.fs.extendJSON(
self.destinationPath("package.json"),
// eslint-disable-next-line @typescript-eslint/no-var-requires
require(resolveFile("package.json.js"))(self.answers.devServer),
);
// Generate entry file
let entry = "./src/index.";
if (self.answers.langType == "Typescript") {
entry += "ts";
} else {
entry += "js";
}
self.fs.copyTpl(resolveFile("index.js"), self.destinationPath(entry));
// Generate README
self.fs.copyTpl(resolveFile("README.md"), self.destinationPath("README.md"), {});
// Generate HTML file
self.fs.copyTpl(resolveFile("template.html"), self.destinationPath("index.html"), {});
// Generate webpack configuration
self.fs.copyTpl(
resolveFile("webpack.configjs.tpl"),
self.destinationPath("webpack.config.js"),
{ ...self.answers, entry },
);
self.configurationPath = self.destinationPath("webpack.config.js");
// Generate JS language essentials
switch (self.answers.langType) {
case "ES6":
self.fs.copyTpl(resolveFile(".babelrc"), self.destinationPath(".babelrc"));
break;
case "Typescript":
self.fs.copyTpl(resolveFile("tsconfig.json"), self.destinationPath("tsconfig.json"));
break;
}
// Generate postcss configuration
if (self.answers.isPostCSS) {
self.fs.copyTpl(
resolveFile("postcss.config.js"),
self.destinationPath("postcss.config.js"),
);
}
}