文章/答案/技术大牛

发布

社区首页 >问答首页 >基础6+ webpack :无法让基础JS工作

问基础6+ webpack :无法让基础JS工作
EN

Stack Overflow用户

提问于 2017-07-24 16:55:57

回答 1查看 883关注 0票数 2

我正在努力安装fousionjs6和webpack。我有一个“意外的令牌导入”。我认为这应该和巴别塔有关，但我找不到问题出在哪里。

我使用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'

有没有人有主意？

谢谢

webpack-dev-server

javascript

webpack

zurb-foundation

回答 1

Stack Overflow用户

发布于 2017-07-24 18:05:53

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应该会帮助你做到这一点。

票数 4

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/45276232

复制

相似问题

问基础6+ webpack :无法让基础JS工作
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问基础6+ webpack :无法让基础JS工作EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问基础6+ webpack :无法让基础JS工作
EN