ES6: неожиданный импорт токенов

1

При настройке среды Javascript Dev я получаю следующую ошибку.

Я хочу использовать import вместо require.

npm install babel-register babel-preset-env --save-dev

Я использовал babel.

 import express from 'express';
                                                              ^^^^^^

SyntaxError: Unexpected token import
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)
    at Module._compile (module.js:617:28)
    at loader (D:\firstapp\node_modules\babel-register\lib\node.js:144:5)
    at Object.require.extensions.(anonymous function) [as .js] (D:\firstapp\node_modules\babel-register\lib\node.js:154:7)

Я пробовал много решений от следующего, но не работает или меня.

Ошибка узла: SyntaxError: неожиданный импорт маркера

Node.js - SyntaxError: неожиданный импорт маркера

srcServer.js

import express from 'express';
import path from 'path';
import open from 'open';
import webpack from 'webpack';
import config from '../webpack.config.babel.js';

const port = 3000;
const app = express();
const compiler = webpack(config);

app.use(require('webpack-dev-middleware')(compiler, {
  noInfo: true,
  publicPath: config.output.publicPath
}));

app.get('/', function(req, res) {
    res.sendFile(path.join(__dirname, '../src/index.html'));
});

app.listen(port, function(err) {
    if (err) {
        console.log(err);
    } else {
        open('http://localhost:' + port);
    }
});

.babelrc

{
  "presets": ["@babel/preset-env"]
}
  • 2
    Удалить первую фигурную скобку?
  • 0
    @NurbolAlpysbayev Извините, фигурных скобок нет. Убрал что
Показать ещё 4 комментария
Теги:
ecmascript-6
npm
babel

1 ответ

1
Лучший ответ

Наконец я получил решение. Я создал файл .babelrc в корневой папке после содержимого.

{
    "presets": ["latest"]
}

Затем npm install и npm start -s работали для меня.

Если у кого-то есть проблема, я разместил здесь все файлы.

инструменты/srcServer.js

import express from 'express';
import path from 'path';
import open from 'open';
import webpack from 'webpack';
import config from '../webpack.config.dev.js';

const port = 3000;
const app = express();
const compiler = webpack(config);

app.use(require('webpack-dev-middleware')(compiler, {
  noInfo: true,
  publicPath: config.output.publicPath
}));

app.get('/', function(req, res) {
    res.sendFile(path.join(__dirname, '../src/index.html'));
});

app.listen(port, function(err) {
    if (err) {
        console.log(err);
    } else {
        open('http://localhost:' + port);
    }
});

webpack.config.dev.js

import path from 'path';

export default {
  debug: true,
  devtool: 'inline-source-map',
  noInfo: false,
  entry: [
    path.resolve(__dirname, 'src/index')
  ],
  target: 'web',
  output: {
    path: path.resolve(__dirname, 'src'),
    publicPath: '/',
    filename: 'bundle.js'
  },
  plugins: [],
  module: {
    loaders: [
      {test: /\.js$/, exclude: /node_modules/, loaders: ['babel']},
      {test: /\.css$/, loaders: ['style','css']}
    ]
  }
}

package.json

{
  "name": "firstapp",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "npm-run-all --parallel open-src",
    "open-src": "babel-node tools/srcServer.js"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-core": "^6.17.0",
    "babel-loader": "6.2.5",
    "babel-preset-env": "^1.7.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-latest": "^6.16.0",
    "babel-register": "^6.16.3",
    "chai": "3.5.0",
    "chalk": "1.1.3",
    "cheerio": "0.22.0",
    "compression": "^1.7.3",
    "cross-env": "3.1.3",
    "css-loader": "0.25.0",
    "eslint": "3.8.1",
    "eslint-plugin-import": "^2.14.0",
    "eslint-watch": "2.1.14",
    "express": "^4.16.4",
    "extract-text-webpack-plugin": "1.0.1",
    "file-loader": "^2.0.0",
    "html-webpack-plugin": "2.22.0",
    "image-webpack-loader": "^4.3.1",
    "jsdom": "9.8.0",
    "json-schema-faker": "^0.4.7",
    "json-server": "^0.14.0",
    "localtunnel": "^1.9.1",
    "mocha": "3.1.2",
    "nock": "8.1.0",
    "npm-run-all": "3.1.1",
    "nsp": "2.6.2",
    "numeral": "1.5.3",
    "open": "0.0.5",
    "rimraf": "2.5.4",
    "style-loader": "0.13.1",
    "webpack": "1.13.2",
    "webpack-dev-middleware": "1.8.4",
    "webpack-hot-middleware": "2.13.0",
    "webpack-md5-hash": "0.0.5"
  },
  "dependencies": {
    "add": "^2.0.6"
  }
}
  • 1
    Вы смешивали Babel 6 и Babel 7! Когда вы впервые добавили свои "presets": ["@babel/preset-env"] .babelrc "presets": ["@babel/preset-env"] (babel 7!), Вы должны были установить с помощью npm install --save-dev @babel/core @babel/preset-env @babel/register . Теперь это работает, потому что вы используете установку Babel 6.
  • 0
    @axm__ Спасибо за указание на проблему

Ещё вопросы

Сообщество Overcoder
Наверх
Меню