有如下两个文件
<html>
<head>
<title>Vue Hello World</title>
</head>
<body>
<div id="app"></div>
</body>
</html>
import Vue from 'vue';
new Vue({
el: '#app',
template: "<p> test <p>"
});
使用 webpack 打包后，在浏览器中运行，结果是这样的
<html>
<head>
<title>Vue Hello World</title>
</head>
<body>
<div id="app"></div>
<script src="main.js"></script>
</body>
</html>
并没有替换到
 |
1
troycode May 21, 2020
页面里需引用 <template></template>
|
 |
2
SilentDepth May 21, 2020
你的代码看起来没啥问题。控制台里没有异常吗？
|
 |
3
asanelder OP @SilentDepth 没有任何异常，通过浏览器的 devtools 工具来查看的话，div element 没有了
|
|
5
SilentDepth May 21, 2020
我刚注意到你的 template 写错了，<p> 的关闭标签 = =|||
|
|
6
asanelder OP @SilentDepth 感谢回复啊，我找到原因了。
主要是 webpack 最后打包成的 bundle.js 不包含 vue-compile, 所以 template: '<p> test </p>' 是不起作用的。 要想起作用，需要使用 SFC 或者 render 函数。 |
|
7
SilentDepth May 21, 2020
不是啊，我试了下 <p>test</p> 是可以正常编译的
|
|
8
asanelder OP @SilentDepth 你的 webpack 文件？ 你在浏览器中打开 html,显示 test 么？
|
|
9
SilentDepth May 21, 2020
本地又试了下，确实是不行（刚才在 CodeSandbox 上试的，可以正常编译）
|
 |
10
ghosthcp516 May 21, 2020
vue.runtime.js 没有 template 编译相关的代码，不能直接写 template，vue.js 才行。
|
|
11
ghosthcp516 May 21, 2020
@ghosthcp516 即便使用了 vue-template-compiler， 也只能在.vue 文件中写 template， .js 文件就爱莫能助了
|
|
12
asanelder OP @ghosthcp516 差不多是这个意思，看我 6 楼的回复
|
Select Language