javascript - Visual Studio Gulp Babel 解析导入
问题描述
如何让 gulp-babel 解析 js 文件的导入。因为现在它在visual studio中运行没有错误,但导入没有解决。是否需要指定要导入的模块的源目录 - 如何在 gulpfile.js 中指定?
gulpfile.js
"use strict";
var gulp = require("gulp");
var babel = require("gulp-babel");
gulp.task("js", function () {
return gulp.src('./wwwroot/js/app.js')
.pipe(babel())
. pipe(gulp.dest('./wwwroot/js/babel'));
});
应用程序.js:
import { MDCRipple } from '@material/ripple';
import { MDCTextField } from '@material/textfield';
const username = new MDCTextField(document.querySelector('.username'));
const password = new MDCTextField(document.querySelector('.password'));
new MDCRipple(document.querySelector('.cancel'));
new MDCRipple(document.querySelector('.next'));
解决方案
这解决了这个问题:
https://github.com/babel/babelify/issues/247
在我目前的理解中,问题是:依赖项没有被转换为 browserify 可以理解的 javascript 版本。
[什么有效]
gulpfile.js:
"use strict";
var gulp = require("gulp");
var browserify = require('browserify');
var source = require('vinyl-source-stream');
var babelify = require('babelify');
gulp.task("js", function () {
browserify('./wwwroot/js/app.js')
.transform("babelify", {
global: true,
presets: ["es2015", "es2016", "stage-0"],
ignore: /\/node_modules\/underscore/
})
.bundle()
.pipe(source('babel.js'))
.pipe(gulp.dest('./wwwroot/js'));
});
包.json:
{
"version": "1.0.0",
"name": "asp.net",
"private": true,
"devDependencies": {
"babel-core": "6.26.3",
"gulp": "3.9.1",
"browserify": "15.0.0",
"babelify": "8.0.0",
"babel-preset-es2015": "6.24.1",
"babel-preset-es2016": "6.24.1",
"babel-preset-stage-0": "6.24.1",
"vinyl-source-stream": "2.0.0",
"material-components-web": "0.28.0"
}
}
推荐阅读
- javascript - 有条件地在 Angular 路由器的空路径上加载模块
- javascript - 在 ReactJS 中按属性动态过滤
- java - 使用 Spark SQL 的 Java 中的美元符号函数调用
- javascript - 如何创建嵌套 For 循环以在我的 Nightmare javascript 代码中输入数据
- ambari - Splice Machine 主安装在 HDP 2.6.4 上产生错误
- c++ - 我怎样才能存储一个ID
在 C++ 代码中? - jenkins - 如何根据日期和相应的标签运行测试
- arrays - 使用数组存储数据,是好是坏?
- python - 替换 Tkinter 小部件的内容
- java - 如何修复 FileInputStream 只查看最后一个条目?