我有一个项目,其中使用了一些vue js和其他js代码。在开发模式下工作正常 但是,当我运行npm run production时,它不起作用(在本地主机以及实时服务器中),并且在控制台中它不会引发任何错误;当我运行npm run production时,它成功运行,并且没有给我任何错误,但是我运行npm运行生产后,它将无法正常运行。并非所有代码,而是js代码的一部分都无法像我使用的富文本编辑器一样工作。
这是我的混音文件
const mix = require('laravel-mix');
require('laravel-mix-purgecss');
mix.js(['resources/js/admin/admin.js'], 'public/js/admin.js')
.sass('resources/sass/admin/admin.scss', 'public/css/admin.css').purgeCss();
if (mix.inProduction()) {
mix.version()
.options({
// Optimize JS minification process
terser: {
cache: true,
parallel: true,
sourceMap: true
}
});
} else {
mix.webpackConfig({
devtool: 'inline-source-map'
}).sourceMaps();
}
这是我的主要js文件
import './bootstrap';
import 'vue-multiselect/dist/vue-multiselect.min.css';
import VModal from 'vue-js-modal'
Vue.use(VModal, {
dialog: true
});
import flatPickr from 'vue-flatpickr-component';
import VueQuillEditor from 'vue-quill-editor';
import Notifications from 'vue-notification';
import Multiselect from 'vue-multiselect';
import VeeValidate from 'vee-validate';
import 'flatpickr/dist/flatpickr.css';
import VueCookie from 'vue-cookie';
import {
Admin
} from 'craftable';
import Vue from 'vue';
Vue.use(require('vue-resource'));
import InfiniteLoading from 'vue-infinite-loading';
import VueApexCharts from 'vue-apexcharts';
import './app-components/bootstrap';
import './index';
Vue.component('flash', require('../frontend/components/Flash.vue').default);
import 'craftable/dist/ui';
import draggable from 'vuedraggable';
Vue.component('apexchart', VueApexCharts);
Vue.component('categories', require('./categories/Categories').default);
Vue.component('admin-add-books-orders', require('./orders/AdminAddBooks').default);
Vue.component('add-discount-group', require('./automatic-discounts/AddDiscountGroup').default);
Vue.component('customer-alert-message', require('./orders/CustomerAlert').default);
Vue.component('dashboard', require('./dashboard/Dashboard').default);
Vue.component('multiselect', Multiselect);
Vue.use(VeeValidate, {
strict: true
});
Vue.component('datetime', flatPickr);
Vue.use(VueQuillEditor);
Vue.use(Notifications);
Vue.use(VueCookie);
window.events = new Vue();
window.flash = function (message, level = 'success') {
window.events.$emit('flash', {
message,
level
});
};
new Vue({
el:'#app',
mixins: [Admin],
components: {
InfiniteLoading,
},
});
(function ($) {
$.fn.countTo = function (options) {
options = options || {};
return $(this).each(function () {
// set options for current element
var settings = $.extend({}, $.fn.countTo.defaults, {
from: $(this).data('from'),
to: $(this).data('to'),
speed: $(this).data('speed'),
refreshInterval: $(this).data('refresh-interval'),
decimals: $(this).data('decimals')
}, options);
// how many times to update the value, and how much to increment the value on each update
var loops = Math.ceil(settings.speed / settings.refreshInterval),
increment = (settings.to - settings.from) / loops;
// references & variables that will change with each update
var self = this,
$self = $(this),
loopCount = 0,
value = settings.from,
data = $self.data('countTo') || {};
$self.data('countTo', data);
// if an existing interval can be found, clear it first
if (data.interval) {
clearInterval(data.interval);
}
data.interval = setInterval(updateTimer, settings.refreshInterval);
// initialize the element with the starting value
render(value);
function updateTimer() {
value += increment;
loopCount++;
render(value);
if (typeof (settings.onUpdate) == 'function') {
settings.onUpdate.call(self, value);
}
if (loopCount >= loops) {
// remove the interval
$self.removeData('countTo');
clearInterval(data.interval);
value = settings.to;
if (typeof (settings.onComplete) == 'function') {
settings.onComplete.call(self, value);
}
}
}
function render(value) {
var formattedValue = settings.formatter.call(self, value, settings);
$self.html(formattedValue);
}
});
};
$.fn.countTo.defaults = {
from: 0, // the number the element should start at
to: 0, // the number the element should end at
speed: 1000, // how long it should take to count between the target numbers
refreshInterval: 100, // how often the element should be updated
decimals: 0, // the number of decimal places to show
formatter: formatter, // handler for formatting the value before rendering
onUpdate: null, // callback method for every time the element is updated
onComplete: null // callback method for when the element finishes updating
};
function formatter(value, settings) {
return value.toFixed(settings.decimals);
}
}(jQuery));
jQuery(function ($) {
// custom formatting example
$('.count-number').data('countToOptions', {
formatter: function (value, options) {
return value.toFixed(options.decimals).replace(/\B(?=(?:\d{3})+(?!\d))/g, ',');
}
});
// start all the timers
$('.timer').each(count);
function count(options) {
var $this = $(this);
options = $.extend({}, options || {}, $this.data('countToOptions') || {});
$this.countTo(options);
}
});