mirror of https://github.com/onivim/oni.git
* Improve developer experience when laoding from webpack, and provide alternative launch mechanism * Add webpack laoder scripts
This commit is contained in:
parent
71b5891d93
commit
b93c4dbaa8
14
index.html
14
index.html
|
@ -21,6 +21,15 @@
|
||||||
script {
|
script {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@keyframes spinner-rotate {
|
||||||
|
0% { transform: rotateY(0deg); }
|
||||||
|
100% { transform: rotateY(360deg); }
|
||||||
|
}
|
||||||
|
|
||||||
|
.webpack-loading-image {
|
||||||
|
animation: spinner-rotate 2s linear infinite;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
@ -29,10 +38,7 @@
|
||||||
console.timeStamp("browser.domloaded")
|
console.timeStamp("browser.domloaded")
|
||||||
var path = "lib/browser/bundle.js"
|
var path = "lib/browser/bundle.js"
|
||||||
if(process.env.ONI_WEBPACK_LOAD) {
|
if(process.env.ONI_WEBPACK_LOAD) {
|
||||||
path = "http://localhost:8191/bundle.js";
|
path = "scripts/dev_webpack_loader.js"
|
||||||
const hotReloadElement = document.createElement("div");
|
|
||||||
hotReloadElement.textContent = "Waiting for webpack compilation... You may need to reload the browser once webpack finishes compiling."
|
|
||||||
document.body.appendChild(hotReloadElement)
|
|
||||||
}
|
}
|
||||||
var scriptTag = document.createElement("script");
|
var scriptTag = document.createElement("script");
|
||||||
scriptTag.src = path
|
scriptTag.src = path
|
||||||
|
|
|
@ -137,7 +137,7 @@
|
||||||
"precommit": "pretty-quick --staged",
|
"precommit": "pretty-quick --staged",
|
||||||
"prepush": "npm run build && npm run lint",
|
"prepush": "npm run build && npm run lint",
|
||||||
"build": "npm run build:browser && npm run build:main && npm run build:plugins",
|
"build": "npm run build:browser && npm run build:main && npm run build:plugins",
|
||||||
"build-debug": "npm run build:browser-debug && npm run build:plugins",
|
"build-debug": "npm run build:browser-debug && npm run build:main && npm run build:plugins",
|
||||||
"build:browser": "webpack --config browser/webpack.production.config.js",
|
"build:browser": "webpack --config browser/webpack.production.config.js",
|
||||||
"build:browser-debug": "webpack --config browser/webpack.debug.config.js",
|
"build:browser-debug": "webpack --config browser/webpack.debug.config.js",
|
||||||
"build:main": "cd main && tsc -p tsconfig.json",
|
"build:main": "cd main && tsc -p tsconfig.json",
|
||||||
|
@ -173,6 +173,7 @@
|
||||||
"ccov:remap:browser:lcov": "cd lib_test/browser/src && remap-istanbul --input ../../../coverage/coverage-final.json --output lcov.info --type lcovonly",
|
"ccov:remap:browser:lcov": "cd lib_test/browser/src && remap-istanbul --input ../../../coverage/coverage-final.json --output lcov.info --type lcovonly",
|
||||||
"ccov:clean": "rimraf coverage",
|
"ccov:clean": "rimraf coverage",
|
||||||
"ccov:upload": "codecov",
|
"ccov:upload": "codecov",
|
||||||
|
"launch": "electron lib/main/src/main.js",
|
||||||
"start": "concurrently --kill-others \"npm run start-hot\" \"npm run watch:browser\" \"npm run watch:plugins\"",
|
"start": "concurrently --kill-others \"npm run start-hot\" \"npm run watch:browser\" \"npm run watch:plugins\"",
|
||||||
"start-hot": "cross-env ONI_WEBPACK_LOAD=1 NODE_ENV=development electron lib/main/src/main.js",
|
"start-hot": "cross-env ONI_WEBPACK_LOAD=1 NODE_ENV=development electron lib/main/src/main.js",
|
||||||
"start-not-dev": "cross-env electron main.js",
|
"start-not-dev": "cross-env electron main.js",
|
||||||
|
|
|
@ -0,0 +1,87 @@
|
||||||
|
// Helper script to load webpack
|
||||||
|
|
||||||
|
const WEBPACK_BUNDLE_URL = "http://localhost:8191/bundle.js"
|
||||||
|
|
||||||
|
const hotReloadElement = document.createElement("div")
|
||||||
|
hotReloadElement.style.position = "absolute"
|
||||||
|
hotReloadElement.style.left = "0px"
|
||||||
|
hotReloadElement.style.right = "0px"
|
||||||
|
hotReloadElement.style.bottom = "0px"
|
||||||
|
hotReloadElement.style.top = "0px"
|
||||||
|
hotReloadElement.style.display = "flex"
|
||||||
|
hotReloadElement.style.backgroundColor = "black"
|
||||||
|
hotReloadElement.style.color = "white"
|
||||||
|
hotReloadElement.style.flexDirection = "column"
|
||||||
|
hotReloadElement.style.justifyContent = "center"
|
||||||
|
hotReloadElement.style.alignItems = "center"
|
||||||
|
|
||||||
|
const oniImage = document.createElement("img")
|
||||||
|
oniImage.className = "webpack-loading-image"
|
||||||
|
oniImage.src = "build/icons/128x128.png"
|
||||||
|
|
||||||
|
const textElement = document.createElement("span")
|
||||||
|
textElement.className = "webpack-loading-text"
|
||||||
|
textElement.textContent = "BUILD: Waiting for webpack initialization..."
|
||||||
|
|
||||||
|
const statusElement = document.createElement("span")
|
||||||
|
statusElement.className = "webpack-loading-status"
|
||||||
|
statusElement.textContent = ""
|
||||||
|
|
||||||
|
hotReloadElement.appendChild(oniImage)
|
||||||
|
hotReloadElement.appendChild(textElement)
|
||||||
|
hotReloadElement.appendChild(statusElement)
|
||||||
|
|
||||||
|
document.body.appendChild(hotReloadElement)
|
||||||
|
|
||||||
|
let attempt = 1
|
||||||
|
|
||||||
|
let initialized = false
|
||||||
|
|
||||||
|
const setStatus = statusText => {
|
||||||
|
console.log(statusText)
|
||||||
|
statusElement.textContent = statusText
|
||||||
|
}
|
||||||
|
|
||||||
|
const check = () => {
|
||||||
|
setStatus(
|
||||||
|
"Checking bundle - attempt " +
|
||||||
|
attempt.toString() +
|
||||||
|
". Check console where you ran `npm run start` for output / status...",
|
||||||
|
)
|
||||||
|
|
||||||
|
fetch(WEBPACK_BUNDLE_URL).then(
|
||||||
|
() => {
|
||||||
|
setStatus("Webpack initialized! Loading...")
|
||||||
|
start()
|
||||||
|
},
|
||||||
|
() => {
|
||||||
|
setStatus("Last fetch failed. Retrying...")
|
||||||
|
},
|
||||||
|
)
|
||||||
|
}
|
||||||
|
check()
|
||||||
|
|
||||||
|
let interval = window.setInterval(() => {
|
||||||
|
check()
|
||||||
|
attempt++
|
||||||
|
}, 1000)
|
||||||
|
|
||||||
|
const start = () => {
|
||||||
|
if (!initialized) {
|
||||||
|
initialized = true
|
||||||
|
window.clearInterval(interval)
|
||||||
|
|
||||||
|
document.body.removeChild(hotReloadElement)
|
||||||
|
|
||||||
|
const scriptTag = document.createElement("script")
|
||||||
|
scriptTag.src = WEBPACK_BUNDLE_URL
|
||||||
|
document.body.appendChild(scriptTag)
|
||||||
|
|
||||||
|
// Once the script comes in, it likely will have missed the 'init' event
|
||||||
|
scriptTag.onload = () => {
|
||||||
|
require("electron")
|
||||||
|
.remote.getCurrentWindow()
|
||||||
|
.send("init", { args: [], workingDirectory: process.cwd() })
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue