Question

我访问过一百个网页，但找不到适合我的解决方案。我正在使用webpack babel，但在尝试导入express时出现错误“Unexpected token import”：

.babelrc：

 {
    "moduleId": "myModule",
    "presets": ["es2015", "stage-0"],
    "plugins": ["add-module-exports"]
    }

webpack.config.js：

const path = require('path');
const webpack = require("webpack");
const ExtractTextPlugin=require("extract-text-webpack-plugin");

module.exports = {
    context:__dirname + '/front',
    entry:__dirname + '/front/index.js',
    output:{
        path:__dirname + '/public/assets',
        filename:'bundle.js',
        publicPath:'assets'
    },
    resolveLoader: {
        root: path.join(__dirname, 'node_modules')
    },
    plugins:[
        new webpack.DefinePlugin({
            TEST_ENV:process.env.NODE_ENV === "test"
        }),
        new ExtractTextPlugin("bundle.css",
            {
            publicPath: 'assets/core/css',
            allChunks: true
        })
    ],
    module: {
        loaders: [
            {
                test: /\.js/,
                loader: "babel-loader",
                exclude: /(node_modules|bower_components)/,
                query: {
                    presets: ['es2015']}
            },
            {
                test: /\.html/,
                loader: "raw-loader"},
              {
                test: /\.css$/,
                loader: ExtractTextPlugin.extract("style-loader", "css-loader!autoprefixer-loader?browsers=last 3 version")
            },
            {
                test: /\.scss$/,
                loader: ExtractTextPlugin.extract("style-loader", "css-loader!autoprefixer-loader?browsers=last 3 version!sass-loader")
            }
        ]
    },
    devServer: {
        port: 7000,
    },
    devtool: 'source-map',
}

的package.json：

{
  "name": "SA-19KV",
  "version": "1.0.0",
  "description": "Project Boilerplate",
  "scripts": {
    "ngdev": "webpack-dev-server --content-base public/ --progress --colors ",
    "nghot": "webpack-dev-server --content-base public/ --progress --colors --inline --hot",
    "test": "set NODE_ENV=test && karma start",
    "prod": "webpack -p",
    "backdev": "nodemon server.js --watch back/"
  },
  "dependencies": {
    "angular": "1.5.0",
    "css-loader": "^0.26.1",
    "express": "^4.14.1",
    "style-loader": "^0.13.1"
  },
  "devDependencies": {
    "angular-mocks": "^1.6.1",
    "autoprefixer-loader": "^3.2.0",
    "babel-core": "^6.22.1",
    "babel-loader": "^6.2.10",
    "babel-plugin-add-module-exports": "^0.2.1",
    "babel-preset-es2015": "^6.22.0",
    "babel-preset-stage-0": "^6.5.0",
    "chai": "^3.5.0",
    "css-loader": "^0.26.1",
    "extract-text-webpack-plugin": "^1.0.1",
    "html-webpack-plugin": "1.6.1",
    "karma": "^1.4.1",
    "karma-chai": "^0.1.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-coverage": "^1.1.1",
    "karma-html-detailed-reporter": "^1.1.15",
    "karma-mocha": "^1.3.0",
    "karma-webpack": "^2.0.2",
    "mocha": "^3.2.0",
    "node-sass": "^4.4.0",
    "nodemon": "^1.11.0",
    "raw-loader": "^0.5.1",
    "sass-loader": "^4.1.1",
    "style-loader": "^0.13.1",
    "webpack": "^1.14.0",
    "webpack-dev-server": "1.14.1"
  },
  "author": "Me :-)",
  "license": "ISC"
}

Answer 1

您的package.json脚本未加载您的webpack配置。您可以通过添加--config参数来加载它：

webpack-dev-server --config ./webpack.config.js

意外的令牌导入webpack babel es2015

1 个答案: