![](/img/trans.png)
[英]running node with loader ts-node/esm.js requires imports to have the .js extension
[英]Webpack loader to process esm.js file
我将这个 npm package添加到我的 Vue.js 项目中,并按照说明将插件添加到我的main.js
文件中。
当我使用npm run serve
在本地运行项目时,出现此错误:
./node_modules/@laruiss/vue-dsfr/dist/vue-dsfr.esm.js 954:31
Module parse failed: Unexpected token (954:31)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
这似乎是esm.js
文件类型的问题。 我阅读并尝试了 web 上几十个线程中给出的解决方案,但到目前为止还没有成功。
这是我的package.json
:
{
"name": "my-project",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve --public 127.0.0.1",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"@laruiss/vue-dsfr": "^1.0.0-beta.39",
"@vue/compat": "^3.1.0",
"axios": "^0.21.4",
"bootstrap": "^5.1.0",
"core-js": "^3.6.5",
"register-service-worker": "^1.7.2",
"vue": "^3.1.0",
"vue-router": "^4.0.5",
"vuex": "^3.6.2",
"vuex-persistedstate": "^4.0.0"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-plugin-eslint": "~4.5.0",
"@vue/cli-plugin-pwa": "^4.5.15",
"@vue/cli-plugin-router": "^4.5.15",
"@vue/cli-service": "~4.5.0",
"@vue/compiler-sfc": "^3.1.0",
"babel-eslint": "^10.1.0",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^6.2.2",
"webpack": "^4.46.0",
"webpack-cli": "^4.9.2"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "babel-eslint"
},
"rules": {}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead"
]
}
这是我的vue.config.js
:
module.exports = {
chainWebpack: (config) => {
config.resolve.alias.set('vue', '@vue/compat')
config.module
.rule('vue')
.use('vue-loader')
.tap((options) => {
return {
...options,
compilerOptions: {
compatConfig: {
MODE: 2
}
}
}
})
},
devServer: {
watchOptions: {
ignored: ['node_modules', /public/],
},
},
pwa: {
}
};
这是我的babel.config.js
:
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
]
}
我试图在尝试调试时将"type": "module"
添加到我的package.json
中,但这会引发我的vue.config.js
不是模块的问题。
我也为webpack.config.js
文件尝试了几个选项,但它们都不起作用,所以我现在没有 webpack 配置文件。
欢迎任何解决此问题的建议!
尝试将 type: "module" 添加到您的 pakage.json。 这告诉 webpack 它是一个 moduke 或 esn 文件。 Bu default I thing webpack 将把它当作一个没有类型属性的 commonjs 文件
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.