ES6 Webpack相关导入-模块未找到:错误:无法解决模块
ES6 Webpack相关导入-模块未找到:错误:无法解决模块
提问于 2016-09-10 20:02:33
在使用ES6和Babel时，我试图找到一些有关Webpack和相关进口产品的信息。
我在我的应用程序中的一个简单入口点上有一个导入行：
// app.es6
import * as sayHello from 'sayHello';
console.log(sayHello());sayHello.es6是与app.es6相同的目录。( sayHello.es6含量不显著)。
当我通过命令行运行Webpack编译器时：
$ webpack我得到以下错误：
ERROR in ./app/app.es6
Module not found: Error: Cannot resolve module 'sayHello' in /Users/username/Code/projectname/app这可以通过将路径设置为相对人来解决：
// app.es6 - note the ./ in the import
import * as sayHello from './sayHello';
console.log(sayHello());这有点痛苦，因为它与Babel网站上模块部分下的示例es6代码不同。
这是我的Webpack配置：
var path = require('path');
var webpack = require('webpack');
module.exports = {
entry: [
'babel-polyfill',
'./app/app.es6'
],
output: {
publicPath: '/',
filename: './dist/app.js'
},
debug: true,
devtool: 'source-map',
module: {
loaders: [
{
test: /\.js|\.es6$/,
exclude: /node_modules/,
loader: 'babel-loader',
query:
{
presets:['es2015']
}
}
]
},
resolve: {
extensions: ['', '.js', '.es6'],
},
};问题:有人知道为什么会有这种区别吗？或者Webpack文档中有关ES6模块导入的相关信息在哪里？
回答 1
Stack Overflow用户
发布于 2016-09-10 21:40:12
这是设计上的，没有前缀，它表明模块应该从node_modules目录加载。您可以在webpack配置中设置别名，这将消除对相关模块导入的需求。
resolve: {
alias: {
sayHello: '/absolute/path/to/sayHello'
},
extensions: ['', '.js', '.es6']
}然后Webpack将填补导入语句中的空白，并允许您省略相对路径，import * as sayHello from 'sayHello';将在整个项目中工作。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/39430106
复制相关文章
相似问题
腾讯云开发者
