|
1 | | -[](https://travis-ci.org/w3tecch/aurelia-ts-boilerplate) |
2 | | -[](https://david-dm.org/w3tecch/aurelia-ts-boilerplate) |
3 | | -[](https://david-dm.org/w3tecch/aurelia-ts-boilerplate#info=devDependencies) |
4 | 1 |
|
5 | 2 | ## Prerequisites |
6 | 3 | 1. Install [NodeJS](https://nodejs.org/en/) |
@@ -182,97 +179,3 @@ You can find the configurations in ```<root>/environment```. |
182 | 179 | ## HTML5 pushState routing |
183 | 180 | By default pushState, also known as html5 routing, is enabled. The Webpack server is already configured to handle this but many webserver need |
184 | 181 | extra confuration to enable this. |
185 | | - |
186 | | -## Cordova - Mobile Development |
187 | | - |
188 | | -### Installation |
189 | | -Initiate cordova with the following commands: |
190 | | -```shell |
191 | | -npm install -g cordova |
192 | | -npm run cordova:init |
193 | | -``` |
194 | | - |
195 | | -Finally add the following code just before the ```</body>``` closing tag: |
196 | | -``` |
197 | | -<!-- Cordova --> |
198 | | -<script src="cordova.js"></script> |
199 | | -``` |
200 | | - |
201 | | -Cordova has a issue in the way they serve the source code files to the WebView in the platforms. So we have to remove/alter the following code |
202 | | -to make sure everything works in cordova. |
203 | | - |
204 | | -Remove the following line in src/index.ejs |
205 | | -``` |
206 | | -12: <base href="<%= htmlWebpackPlugin.options.baseUrl %>"> |
207 | | -``` |
208 | | - |
209 | | -Remove the following line in src/app/app.ts |
210 | | -``` |
211 | | -8: config.options.pushState = true; |
212 | | -``` |
213 | | - |
214 | | -Add those lines to the src/styles/_base.scss |
215 | | -``` |
216 | | -html { |
217 | | - -ms-touch-action: manipulation; |
218 | | - touch-action: manipulation; |
219 | | - -webkit-user-select: none; /* Chrome all / Safari all */ |
220 | | - -moz-user-select: none; /* Firefox all */ |
221 | | - -ms-user-select: none; /* IE 10+ */ |
222 | | - user-select: none; /* Likely future */ |
223 | | -} |
224 | | -```css |
225 | | -
|
226 | | -Install the following Libraries |
227 | | -``` |
228 | | -npm i hammerjs fastclick iscroll --save |
229 | | -``` |
230 | | -
|
231 | | -Install the following Libraries |
232 | | -``` |
233 | | -npm i hammerjs fastclick --save |
234 | | -``` |
235 | | -
|
236 | | -Provide those Libraries for the whole app and to do so add this into the config/config-globals.js file. |
237 | | -```` |
238 | | -... |
239 | | -new webpack.ProvidePlugin({ |
240 | | - 'moment': 'moment', |
241 | | - '_': 'lodash', |
242 | | - 'Hammer': 'hammerjs', |
243 | | - 'FastClick': 'fastclick' |
244 | | -}) |
245 | | -... |
246 | | -``` |
247 | | - |
248 | | -Add this at the bottom of the src/main.ts file to activate FastClick and to prevent default by touchmoves. |
249 | | -``` |
250 | | -/** |
251 | | - * Disabels the scroll events from the generel page |
252 | | - */ |
253 | | -document.addEventListener('touchmove', e => e.preventDefault(), false); |
254 | | -
|
255 | | -/** |
256 | | - * Activates Fastclick |
257 | | - */ |
258 | | -$(() => { |
259 | | - FastClick.attach(document.body); |
260 | | -}); |
261 | | -``` |
262 | | - |
263 | | - |
264 | | -### Run and build |
265 | | -Cordova takes the ```www``` folder source to create the Cordova app. This ```www``` folder is a symlink to the ```dist``` folder. |
266 | | -So make sure you run for example ```npm run build``` first before runing/buildinga Cordova app. |
267 | | - |
268 | | -### |
269 | | - |
270 | | - |
271 | | - |
272 | | -### Configs |
273 | | - |
274 | | -bounce |
275 | | - |
276 | | -### Plugins |
277 | | - |
278 | | - |
0 commit comments