我正在努力使用 webpack 安装 foudation js 6。我有一个“意外的 token 导入”。我认为这应该与babel有关，但我找不到问题出在哪里。
我使用 Foundation-sites 6.4.1
这是我的 webpack.config.js
var webpack = require('webpack')
var ExtractTextPlugin = require('extract-text-webpack-plugin')
var HtmlWebpackPlugin = require('html-webpack-plugin')
var express = require('express')
var path = require('path')
module.exports = {
module: {
loaders: [
{ test: /\.json$/, loader: 'json' },
{
test: /\.js$/,
loader: 'babel',
exclude: /node_modules/,
include: path.join(__dirname, 'src'),
},
{ test: /\.scss$/, loader: ExtractTextPlugin.extract('style-loader', 'css!sass') },
{ test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') },
{ test: /\.(eot|svg|ttf|woff2?).*$/, loader: 'url?limit=10000' },
{ test: /\.(png|jpg|jpeg).*$/, loader: 'url?limit=10000' },
],
},
plugins: [
new ExtractTextPlugin('bundle.[hash].css'),
new HtmlWebpackPlugin({
template: 'src/index.html.ejs',
}),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify(process.env.NODE_ENV),
},
}),
new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /fr/),
],
entry: ['./src/index.js', './src/index.scss'],
output: {
path: 'build/',
filename: 'bundle.[hash].js',
},
devServer: {
inline: true,
stats: {
chunks: false,
}
}
}
在我的 .babelrc 中
{
"presets": ["es2015", "es2016", "es2017", "stage-0", "react"],
"plugins": ["transform-async-to-generator", "transform-runtime"]
}
在我的index.html.ejs中
<!DOCTYPE html>
<html lang="en">
<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>Title</title>
</head>
<body>
<div id="app"></div>
</body>
</html>
在我的index.js中，我在文件顶部有这个:
import 'script!jquery'
import 'script!what-input'
import 'script!foundation-sites'
有人有想法吗？
谢谢
最佳答案
entry point of foundation-sites使用 ES 模块(import/export)，但您没有将 babel-loader 应用到 node_modules，因此他们不会被改变。您也许可以导入已经转译的版本:
import 'foundation-sites/dist/js/foundation.js'
从 webpack 2 开始就支持 ES 模块。强烈建议升级 webpack。 official migration guide应该可以帮助你。
关于javascript - 基础 6 + webpack : Cannot make Foundation JS work，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45276232/