taigrr/wails
1
0
Fork 0
mirror of https://github.com/taigrr/wails.git synced 2026-04-02 05:08:54 -07:00
Code Issues Packages Projects Releases Wiki Activity

[v2] Add meta tag to control script injection behaviour

Browse Source
This commit is contained in:
Lea Anthony
2021-10-02 14:04:46 +10:00
parent 7a0cb428f2
commit afb1d12c3b
6 changed files with 274 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
website/docs/guides/frontend.mdx Normal file
View File

@@ -0,0 +1,77 @@
# Frontend
## Execution Order
When Wails serves your `index.html`, by default, it will inject 2 script entries into the `<body>` tag to load `/wails/bindings.js`
and `/wails/runtime.js`. These files install the bindings and runtime respectively.
The code below shows where these are injected by default:
```html
<html>
<head>
<title>injection example</title>
<link rel="stylesheet" href="/main.css">
<!-- <script src="/wails/ipc.js"></script> -->
<!-- <script src="/wails/runtime.js"></script> -->
</head>
<body data-wails-drag>
<div class="logo"></div>
<div class="result" id="result">Please enter your name below 👇</div>
<div class="input-box" id="input" data-wails-no-drag>
<input class="input" id="name" type="text" autocomplete="off">
<button class="btn" onclick="greet()">Greet</button>
</div>
<script src="/main.js"></script>
</body>
</html>
```
### Overriding Default Execution Order
To provide more flexibility to developers, there is a meta tag that may be used to customise this behaviour:
```html
<meta name="wails-options" content="[options]">
```
The options are as follows:
| Value | Description |
| -------------------- | ------------------------------------------------- |
| noautoinjectruntime | Disable the autoinjection of `/wails/runtime.js` |
| noautoinjectbindings | Disable the autoinjection of `/wails/bindings.js` |
| noautoinject | Disable all autoinjection of scripts |
Multiple options may be used provided they are comma seperated.
This code is perfectly valid and operates the same as the autoinjection version:
```html
<html>
<head>
<title>injection example</title>
<meta name="wails-options" content="noautoinject">
<link rel="stylesheet" href="/main.css">
</head>
<body data-wails-drag>
<div class="logo"></div>
<div class="result" id="result">Please enter your name below 👇</div>
<div class="input-box" id="input" data-wails-no-drag>
<input class="input" id="name" type="text" autocomplete="off">
<button class="btn" onclick="greet()">Greet</button>
</div>
<script src="/wails/ipc.js"></script>
<script src="/wails/runtime.js"></script>
<script src="/main.js"></script>
</body>
</html>
```