个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
在 nodejs 中使用 ES6 模块语言时出现错误Chrome 浏览器中的“IMORTS 不能在模块外部使用”错误。
我正在尝试使用 Node js express mongoose morgan express-handlebars 和 ES6 构建我的项目
但是当我运行这个项目时，它给了我一个相同的错误
我尝试使用 .babelrc 和 webpack.config.js 但无法解决它。谁能帮我实现它？
我正在放我的项目图片供您引用。
谢谢
在此输入图片描述
Babelrc:
{
“预设”:[["@babel/环境", {"useBuiltIns": "用法",“corejs”:“3”，“目标”:{“浏览器”:[“最后 5 个版本”，“即 >= 8”]}}]]
webpack.config.js:
const path = require('路径');const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: ['./index.js'],
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'js/bundle.js'
},
devServer: {
contentBase: './dist'
},
plugins: [
new HtmlWebpackPlugin({
title: 'Custom template using Handlebars',
filename: 'index.html',
template: 'main.hbs'
})
],
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader"
}
}
],
loaders: [
{ test: /\.hbs$/, loader: "handlebars-loader" }
]
}
};
main.js:
enter code here
import Search from './models/search';
import Movie from './models/Movie'
import User from './models/user'
import * as searchView from './views/searchView'
import * as movieView from './views/movieView'
import { elements , renderLoader, clearLoader } from './views/base'
const state = {};
const controlSearch = async () => {
// const query = searchView.getInput();
const query = 'avengers';
if (query) {
searchView.clearInput();
searchView.clearResult();
state.search = new Search(query);
state.user = new User();
searchView.clearInput();
searchView.clearResult();
renderLoader(elements.searchRes);
await state.search.getResult();
await state.user.userSignUp();
clearLoader();
console.log(state.search.result);
searchView.renderResults(state.search.result);
}
};
elements.searchForm.addEventListener('submit', e => {
e.preventDefault();
controlSearch();
});
main.hbs
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Movie Recherer</title>
<link rel="stylesheet" href="/css/bootstrap.min.css"/>
<link rel="stylesheet" href="/css/all.min.css"/>
<link rel="stylesheet" href="/css/main.css" />
<link rel="stylesheet" href="/css/home.css" />
</head>
<body>
<div class="container">
<div class="row">
{{{body}}}
</div>
</div>
<script src="/jquery.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
<script language="javascript" src="/js/main.js"></script>
<script language="javascript" src="/js/models/Movie.js"></script>
<script language="javascript" src="/js/models/search.js"></script>
<script language="javascript" src="/js/views/base.js"></script>
<script language="javascript" src="/js/views/movieView.js"></script>
<script language="javascript" src="/js/views/searchView.js"></script>
</body>
</html>
最佳答案
您需要将导入包含在一个模块中:试试这个:
<script type="module"> import btn from './helper' </script>
在 main.hbs 文件的每个脚本标签中添加 type="module"
关于javascript - 未捕获的语法错误 : Cannot use import statement outside a module in node js，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/63661519/
25
4
0
在 go lang 中使用“If with a short statement”有什么好处。引用:go tour if v := math.Pow(x, n); v < lim { retur
完全错误: Warning: Unsafe statement written to the binary log using statement format since BINLOG_FORMAT
完全错误: Warning: Unsafe statement written to the binary log using statement format since BINLOG_FORMAT
我有三个存储过程 Sp1、Sp2 和 Sp3。 第一个 (Sp1) 将执行第二个 (Sp2) 并将返回的数据保存到 @tempTB1 中，第二个将执行第三个 (Sp3) 并将数据保存到 @tempTB
我已将 FLAG 设置为 1，并且正在执行 ARG 值应该仅为 DEV。但是我得到的是 ARG= DEV + CLIENTID 000023 // FLAG=1 000026 // I
我已将 FLAG 设置为 1，并且正在执行 ARG 值应该仅为 DEV。但是我得到的是 ARG= DEV + CLIENTID 000023 // FLAG=1 000026 // I
已关闭。这个问题是 not reproducible or was caused by typos 。目前不接受答案。 这个问题是由拼写错误或无法再重现的问题引起的。虽然类似的问题可能是 on-top
PMD告诉我 A switch with less than 3 branches is inefficient, use a if statement instead. 这是为什么呢？为什么是3？他
我刚开始学习 Racket，所以我仍在努力弄清楚这门语言的复杂性。我正在尝试在列表中实现我自己的搜索功能。如果函数找到它，则返回索引，否则返回 -1。 (define (find-index list
在 Kotlin 中，您可以使用类似于三元运算符的 if 语句。 我们可以选择做这样的事情: val x = if (isOdd) 1 else 2 但是如果我们有多个变量需要根据某些条件进行设置，那
在我的 Android 应用程序中，我尝试使用 XMLPullParser 使用以下代码读取 xml 文件: while (eventType != XmlPullParser.END_DOCUMEN
这个问题已经有答案了: Boolean expressions in Java (8 个回答) 已关闭 7 年前。 我遇到过一些情况，其中第一个似乎改变了 boolean 值，而第二个却没有!两者之间
我基本上想做的是: select * from request where id = 1 and created_at like (today's date); 但使用 Eloquent 。 我试过:
我不确定为什么会收到此代码。基本上我希望能够动态定位我的发射器，但是当我添加一个选项来检查位置并根据需要进行纠正时，我不断收到此错误。 添加的代码是 if (
何时使用语句而不是准备语句。我想语句用于没有参数的查询，但为什么不使用准备好的语句呢？对于没有参数的查询，哪个更快。 最佳答案 I suppose statement is used in queri
我必须创建一个表，如下所示 借款人(客户编号，贷款编号) 如果客户没有超过 3 笔贷款，则可以贷款。 我创建的表如下 create table borrower( customerno int(5),
这个问题在这里已经有了答案: 关闭 12 年前。 Possible Duplicates: Is "else if" faster than "switch() case"? What is the
typescript 版本 2.2.2 我在我的 UserRoutzr.ts 中写了这个要求 const users = require(path.join(process.cwd() + "/da
我有一个用 JPQL 编写的应用程序，它可以命中非常不同的查询(在不同的资源上)。 对于很多此类查询，我需要知道结果总数(计数)，因为我没有应用任何 LIMIT/OFFSET 由于此查询的性质非常不同
我对以下 Java 语句感到困惑: ArtClass artClass0 = new ArtClass(); int int3 = 73; boolean boolean0 = artClass0.f
我是一名优秀的程序员,十分优秀！