我正试图为我即将建立的一个网站实现一个 "实时 "工作流程。
它的基础是 这个模板.
我目前有这个工作流程工作。
编写代码 -> 保存 -> "Rollup watch "从srcmain.js重建buildmain.js -> "live-server "刷新浏览器。
我对很多东西都不熟悉,所以我会诚实地告诉你 每次建造所需时间为8秒 比我以前的工作流程快多了,因为以前的工作流程涉及到手动fileZilla和我这个新手在一个受密码保护的子域上开发。
有什么方法可以让我不需要等待构建发生--这似乎没有必要?例如,使用一个虚拟的index.html来临时链接到srcmain.js,直到我准备好在我的域上构建和部署捆绑版本?
这是当前boilerplate的index.html。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Example for Three JS</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<div id="homepage"></div>
<script src='build/main.js'></script>
<script>
const app = new LIB.App;
app.init();
</script>
</body>
</html>
这里是我的rollup配置文件的样子。
import resolve from '@rollup/plugin-node-resolve'; // locate and bundle dependencies in node_modules (mandatory)
import { terser } from "rollup-plugin-terser"; // code minification (optional)
export default {
input: 'src/main.js',
output: [
{
format: 'umd',
name: 'LIB',
file: 'build/main.js'
}
],
plugins: [ resolve(), terser() ]
};
我试着把脚本源从
<script src='build/main.js'></script>
到
<script src='src/main.js'></script>
和删除。
<script>
const app = new LIB.App;
app.init();
</script>
但这没有工作 - 所以我在这里寻找输入。
答案 "是,我应该使用开发版和prod版来构建我的rollup。开发版应该已经删除了minification。
来自 文件资料:
如果你愿意,你可以指定一个不同于默认的配置文件。rollup.config.js
:
rollup --config rollup.config.dev.js
rollup --config rollup.config.prod.js