this.setDynamic is not a function in vue.js
.babelrc
{
"presets": [
[
"@babel/preset-env",
{
"useBuiltIns": "usage",
"corejs": "2.6.9",
"modules": false,
"targets": {
"browsers": "last 2 versions, not ie <= 9"
}
}
]
],
"plugins": [
[
"@babel/plugin-transform-runtime",
]
]
}
package.json
{
"name": "bianji",
"version": "1.0.0",
"description": "A Vue.js project",
"author": "",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"build": "node build/build.js"
},
"dependencies": {
"@nutui/nutui": "^2.0.9",
"axios": "^0.18.0",
"babel-polyfill": "^6.26.0",
"babel-runtime": "^6.0.0",
"core-js": "^2.6.9",
"img-vuer": "^0.19.1",
"jquery": "^3.4.1",
"moment": "^2.24.0",
"swiper": "^4.5.0",
"vue": "^2.6.10",
"vue-clipboard2": "^0.2.1",
"vue-dplayer": "^0.0.10",
"vue-qriously": "^1.1.1",
"vue-quill-editor": "^3.0.6",
"vue-router": "^3.0.3",
"vue-star-rating": "^1.6.1",
"vue-swipe-actions": "^2.0.0-beta.6"
},
"devDependencies": {
"@babel/core": "^7.6.3",
"@babel/plugin-syntax-dynamic-import": "^7.2.0",
"@babel/plugin-transform-modules-commonjs": "^7.6.0",
"@babel/plugin-transform-runtime": "^7.6.2",
"@babel/polyfill": "^7.6.0",
"@babel/preset-env": "^7.6.3",
"@vue/babel-preset-app": "^3.5.5",
"autoprefixer": "^7.1.2",
"babel-core": "^7.0.0-bridge.0",
"babel-loader": "^7.0.0",
"babel-plugin-transform-runtime": "^6.22.0",
"babel-polyfill": "^6.0.16",
"babel-preset-env": "^1.3.2",
"babel-preset-stage-0": "^6.0.15",
"babel-preset-stage-2": "^6.24.1",
"babel-preset-stage-3": "^6.24.1",
"babel-register": "^6.22.0",
"chalk": "^2.0.1",
"copy-webpack-plugin": "^4.0.1",
"css-loader": "^0.28.0",
"cube-ui": "~1.12.15",
"eventsource-polyfill": "^0.9.6",
"extract-text-webpack-plugin": "^3.0.0",
"file-loader": "^1.1.4",
"friendly-errors-webpack-plugin": "^1.6.1",
"html-webpack-plugin": "^2.30.1",
"less": "^2.7.3",
"less-loader": "^4.0.5",
"node-notifier": "^5.1.2",
"node-sass": "^4.12.0",
"optimize-css-assets-webpack-plugin": "^3.2.0",
"ora": "^1.2.0",
"portfinder": "^1.0.13",
"postcss-import": "^11.0.0",
"postcss-loader": "^2.0.8",
"rimraf": "^2.6.0",
"sass-loader": "^7.1.0",
"sass-resources-loader": "^2.0.1",
"semver": "^5.3.0",
"shelljs": "^0.7.6",
"stylus": "^0.54.5",
"stylus-loader": "^3.0.2",
"url-loader": "^0.5.8",
"vue-awesome-swiper": "^3.0.0",
"vue-cli-plugin-cube-ui": "^0.2.5",
"vue-lazyload": "^1.2.6",
"vue-loader": "^12.1.0",
"vue-style-loader": "^3.0.1",
"vue-template-compiler": "^2.6.10",
"webpack": "^3.6.0",
"webpack-bundle-analyzer": "^2.9.0",
"webpack-dev-server": "^2.9.1",
"webpack-merge": "^4.1.0"
},
"engines": {
"node": ">= 4.0.0",
"npm": ">= 3.0.0"
},
"postcss": {
"plugins": {
"autoprefixer": {}
}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 11",
"Android >= 4.0",
"iOS >= 8"
],
"resolutions": {
"browserslist": "4.6.3",
"caniuse-lite": "1.0.30000974"
},
"transformModules": {
"cube-ui": {
"transform": "cube-ui/src/modules/${member}",
"kebabCase": true
}
}
}
babel.config.js
module.exports = {
presets: ["@babel/preset-env"],
plugins: ["syntax-dynamic-import", "@babel/transform-runtime"]
};
webpack.config.js
'use strict'
const path = require('path')
const utils = require('./utils')
const config = require('../config')
const vueLoaderConfig = require('./vue-loader.conf')
function resolve(dir) {
return path.join(__dirname, '..', dir)
}
module.exports = {
context: path.resolve(__dirname, "../"),
entry: {
app: "./src/main.js"
},
output: {
// path: config.build.assetsRoot,
// filename: 'pk-skin.min.js',
path: path.resolve(__dirname, "dist"),
filename: "[name].bundle.js",
publicPath:
process.env.NODE_ENV === "production"
? config.build.assetsPublicPath
: config.dev.assetsPublicPath
},
resolve: {
extensions: [".js", ".vue", ".json"],
alias: {
vue$: "vue/dist/vue.esm.js",
"@": resolve("src")
}
},
module: {
rules: [
{
test: /\.vue$/,
loader: "vue-loader",
options: vueLoaderConfig
},
{
test: /\.js$/,
loader: "babel-loader",
// include: [resolve("src")],
exclude: /node_modules/,
options: {
//预设
presets: ["@babel/preset-env"],
plugins: ["syntax-dynamic-import", "transform-runtime"]
}
},
{
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
loader: "url-loader",
options: {
limit: 10000,
name: utils.assetsPath("img/[name].[hash:7].[ext]")
}
},
{
test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
loader: "url-loader",
options: {
limit: 10000,
name: utils.assetsPath("media/[name].[hash:7].[ext]")
}
},
{
test: /\.less$/,
loader: "style-loader!css-loader!less-loader"
},
// {
// test: /\.(sa|sc)ss$/,
// include: [resolve("src")],
// use: [
// {
// loader: "style-loader!css-loader!sass-loader!postcss-loader",
// options: {
// data: `@import "@nutui/nutui/dist/styles/index.scss";@import "@/components/scss/skin.scss";@import "@/components/scss/common.scss"; `
// }
// }
// ]
// },
// {
// test: /\.(css|scss|sass)$/,
// include: [],
// loader: ["style-loader", "css-loader", "sass-loader", "postcss-loader"]
// },
{
// 增加对 SCSS 文件的支持
test: /\.(sa|sc)ss$/,
include: [resolve("src/assets")],
// SCSS 文件的处理顺序为先 sass-loader 再 css-loader 再 style-loader
use: [
"style-loader",
"css-loader",
{
loader: "sass-loader"
// options: { webpack4 vue-cli3
// data: `@import "@/styles/skin.scss";@import "@/styles/common.scss";@import "@nutui/nutui/dist/styles/index.scss";`
// }
}
]
},
{
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
loader: "url-loader",
options: {
limit: 10000,
name: utils.assetsPath("fonts/[name].[ext]")
}
},
{
test: /\.styl(us)?$/,
use: ["vue-style-loader", "css-loader", "stylus-loader"]
}
]
}
};
搜索了很多的关于this.setDynamic error
的答案,但是还是无法解决,求大佬指点一下~
error
Module build failed: TypeError: this.setDynamic is not a function
at PluginPass.pre (C:\proj\src\login\node_modules\babel-plugin-transform-runtime\lib\index.js:31:12)
at transformFile (C:\proj\src\login\node_modules\@babel\core\lib\transformation\index.js:97:25)
at runSync (C:\proj\src\login\node_modules\@babel\core\lib\transformation\index.js:35:3)
at transformSync (C:\proj\src\login\node_modules\@babel\core\lib\transform-sync.js:15:38)
at Object.transform (C:\proj\src\login\node_modules\@babel\core\lib\transform.js:20:65)
at transpile (C:\proj\src\login\node_modules\babel-loader\lib\index.js:55:20)
at Object.module.exports (C:\proj\src\login\node_modules\babel-loader\lib\i
现在发现是因为在导入的包中有扩展运算符,然而webpack不能编译node_modules中的扩展运算符导致的报错,这样写也不对【重点】
include: [resolve("src"),resolve("vue-swipe-actions")],
// exclude: [/node_modules/]
vue-swipe-actions是node中的包,目前暂行办法是把有扩展运算符的插件【vue-swipe-actions】引入项目中当做源文件而不是包引入,这样才能编译完成~
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
你把完整的错误都发出来,
你的问题,可能是几个地方的问题:
以上的全部使用 npm uni xxx 卸载掉
webpack 跨域的设置
webpack 是有个 devServer 的配置,具体 代理( 跨域)配置如下:
你这个是全部都排除了
你想编译哪个 你就include一下嘛