1 | const { join, relative, resolve, sep } = require("path");
|
2 |
|
3 | const webpack = require("webpack");
|
4 | const nsWebpack = require("nativescript-dev-webpack");
|
5 | const nativescriptTarget = require("nativescript-dev-webpack/nativescript-target");
|
6 | const CleanWebpackPlugin = require("clean-webpack-plugin");
|
7 | const CopyWebpackPlugin = require("copy-webpack-plugin");
|
8 | const { BundleAnalyzerPlugin } = require("webpack-bundle-analyzer");
|
9 | const { NativeScriptWorkerPlugin } = require("nativescript-worker-loader/NativeScriptWorkerPlugin");
|
10 | const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
|
11 |
|
12 | module.exports = env => {
|
13 |
|
14 | const appComponents = [
|
15 | "tns-core-modules/ui/frame",
|
16 | "tns-core-modules/ui/frame/activity",
|
17 | ];
|
18 |
|
19 | const platform = env && (env.android && "android" || env.ios && "ios");
|
20 | if (!platform) {
|
21 | throw new Error("You need to provide a target platform!");
|
22 | }
|
23 |
|
24 | const platforms = ["ios", "android"];
|
25 | const projectRoot = __dirname;
|
26 |
|
27 |
|
28 | const dist = resolve(projectRoot, nsWebpack.getAppPath(platform, projectRoot));
|
29 | const appResourcesPlatformDir = platform === "android" ? "Android" : "iOS";
|
30 |
|
31 | const {
|
32 |
|
33 |
|
34 |
|
35 | appPath = "app",
|
36 | appResourcesPath = "app/App_Resources",
|
37 |
|
38 |
|
39 | snapshot,
|
40 | uglify,
|
41 | report,
|
42 | sourceMap,
|
43 | hmr,
|
44 | } = env;
|
45 | const externals = nsWebpack.getConvertedExternals(env.externals);
|
46 |
|
47 | const appFullPath = resolve(projectRoot, appPath);
|
48 | const appResourcesFullPath = resolve(projectRoot, appResourcesPath);
|
49 |
|
50 | const entryModule = nsWebpack.getEntryModule(appFullPath);
|
51 | const entryPath = `.${sep}${entryModule}.ts`;
|
52 | const entries = { bundle: entryPath };
|
53 | if (platform === "ios") {
|
54 | entries["tns_modules/tns-core-modules/inspector_modules"] = "inspector_modules.js";
|
55 | };
|
56 |
|
57 | const config = {
|
58 | mode: uglify ? "production" : "development",
|
59 | context: appFullPath,
|
60 | externals,
|
61 | watchOptions: {
|
62 | ignored: [
|
63 | appResourcesFullPath,
|
64 |
|
65 | "**/.*",
|
66 | ]
|
67 | },
|
68 | target: nativescriptTarget,
|
69 | entry: entries,
|
70 | output: {
|
71 | pathinfo: false,
|
72 | path: dist,
|
73 | libraryTarget: "commonjs2",
|
74 | filename: "[name].js",
|
75 | globalObject: "global",
|
76 | },
|
77 | resolve: {
|
78 | extensions: [".ts", ".js", ".scss", ".css"],
|
79 |
|
80 | modules: [
|
81 | resolve(__dirname, "node_modules/tns-core-modules"),
|
82 | resolve(__dirname, "node_modules"),
|
83 | "node_modules/tns-core-modules",
|
84 | "node_modules",
|
85 | ],
|
86 | alias: {
|
87 | '~': appFullPath
|
88 | },
|
89 |
|
90 | symlinks: true
|
91 | },
|
92 | resolveLoader: {
|
93 |
|
94 | symlinks: false
|
95 | },
|
96 | node: {
|
97 |
|
98 | "http": false,
|
99 | "timers": false,
|
100 | "setImmediate": false,
|
101 | "fs": "empty",
|
102 | "__dirname": false,
|
103 | },
|
104 | devtool: sourceMap ? "inline-source-map" : "none",
|
105 | optimization: {
|
106 | runtimeChunk: "single",
|
107 | splitChunks: {
|
108 | cacheGroups: {
|
109 | vendor: {
|
110 | name: "vendor",
|
111 | chunks: "all",
|
112 | test: (module, chunks) => {
|
113 | const moduleName = module.nameForCondition ? module.nameForCondition() : '';
|
114 | return /[\\/]node_modules[\\/]/.test(moduleName) ||
|
115 | appComponents.some(comp => comp === moduleName);
|
116 |
|
117 | },
|
118 | enforce: true,
|
119 | },
|
120 | }
|
121 | },
|
122 | minimize: !!uglify,
|
123 | minimizer: [
|
124 | new UglifyJsPlugin({
|
125 | parallel: true,
|
126 | cache: true,
|
127 | uglifyOptions: {
|
128 | output: {
|
129 | comments: false,
|
130 | },
|
131 | compress: {
|
132 |
|
133 |
|
134 | 'collapse_vars': platform !== "android",
|
135 | sequences: platform !== "android",
|
136 | }
|
137 | }
|
138 | })
|
139 | ],
|
140 | },
|
141 | module: {
|
142 | rules: [
|
143 | {
|
144 | test: new RegExp(entryPath),
|
145 | use: [
|
146 |
|
147 | platform === "android" && {
|
148 | loader: "nativescript-dev-webpack/android-app-components-loader",
|
149 | options: { modules: appComponents }
|
150 | },
|
151 |
|
152 | {
|
153 | loader: "nativescript-dev-webpack/bundle-config-loader",
|
154 | options: {
|
155 | loadCss: !snapshot,
|
156 | }
|
157 | },
|
158 | ].filter(loader => !!loader)
|
159 | },
|
160 |
|
161 | {
|
162 | test: /-page\.ts$/,
|
163 | use: "nativescript-dev-webpack/script-hot-loader"
|
164 | },
|
165 |
|
166 | {
|
167 | test: /\.(css|scss)$/,
|
168 | use: "nativescript-dev-webpack/style-hot-loader"
|
169 | },
|
170 |
|
171 | {
|
172 | test: /\.(html|xml)$/,
|
173 | use: "nativescript-dev-webpack/markup-hot-loader"
|
174 | },
|
175 |
|
176 | { test: /\.(html|xml)$/, use: "nativescript-dev-webpack/xml-namespace-loader"},
|
177 |
|
178 | {
|
179 | test: /\.css$/,
|
180 | use: { loader: "css-loader", options: { minimize: false, url: false } }
|
181 | },
|
182 |
|
183 | {
|
184 | test: /\.scss$/,
|
185 | use: [
|
186 | { loader: "css-loader", options: { minimize: false, url: false } },
|
187 | "sass-loader"
|
188 | ]
|
189 | },
|
190 |
|
191 | {
|
192 | test: /\.ts$/,
|
193 | use: {
|
194 | loader: "ts-loader",
|
195 | options: {
|
196 | configFile: "tsconfig.tns.json",
|
197 | allowTsInNodeModules: true,
|
198 | },
|
199 | }
|
200 | },
|
201 | ]
|
202 | },
|
203 | plugins: [
|
204 |
|
205 | new webpack.DefinePlugin({
|
206 | "global.TNS_WEBPACK": "true",
|
207 | "process": undefined,
|
208 | }),
|
209 |
|
210 | new CleanWebpackPlugin([ `${dist}/**/*` ]),
|
211 |
|
212 | new CopyWebpackPlugin([
|
213 | { from: { glob: "fonts/**" } },
|
214 | { from: { glob: "**/*.jpg" } },
|
215 | { from: { glob: "**/*.png" } },
|
216 | ], { ignore: [`${relative(appPath, appResourcesFullPath)}/**`] }),
|
217 |
|
218 | new nsWebpack.GenerateBundleStarterPlugin(
|
219 |
|
220 |
|
221 |
|
222 | (snapshot ? [] : ["./runtime"])
|
223 | .concat([
|
224 | "./vendor",
|
225 | "./bundle",
|
226 | ])
|
227 | ),
|
228 |
|
229 |
|
230 | new NativeScriptWorkerPlugin(),
|
231 | new nsWebpack.PlatformFSPlugin({
|
232 | platform,
|
233 | platforms,
|
234 | }),
|
235 |
|
236 | new nsWebpack.WatchStateLoggerPlugin(),
|
237 | ],
|
238 | };
|
239 |
|
240 |
|
241 |
|
242 | if (!externals || externals.length === 0) {
|
243 | config.plugins.push(new CopyWebpackPlugin([
|
244 | {
|
245 | from: `${appResourcesFullPath}/${appResourcesPlatformDir}`,
|
246 | to: `${dist}/App_Resources/${appResourcesPlatformDir}`,
|
247 | context: projectRoot
|
248 | },
|
249 | ]));
|
250 | }
|
251 |
|
252 | if (report) {
|
253 |
|
254 | config.plugins.push(new BundleAnalyzerPlugin({
|
255 | analyzerMode: "static",
|
256 | openAnalyzer: false,
|
257 | generateStatsFile: true,
|
258 | reportFilename: resolve(projectRoot, "report", `report.html`),
|
259 | statsFilename: resolve(projectRoot, "report", `stats.json`),
|
260 | }));
|
261 | }
|
262 |
|
263 | if (snapshot) {
|
264 | config.plugins.push(new nsWebpack.NativeScriptSnapshotPlugin({
|
265 | chunk: "vendor",
|
266 | requireModules: [
|
267 | "tns-core-modules/bundle-entry-points",
|
268 | ],
|
269 | projectRoot,
|
270 | webpackConfig: config,
|
271 | }));
|
272 | }
|
273 |
|
274 | if (hmr) {
|
275 | config.plugins.push(new webpack.HotModuleReplacementPlugin());
|
276 | }
|
277 |
|
278 |
|
279 | return config;
|
280 | };
|