我正在使用实现 Browserify-Rails 的 Rails 4.0 项目实现Babelify .
在我的本地和远程 Beta 服务器上,一切似乎都很顺利。但是当我部署到生产环境时,某些文件将被跳过,如果它们中有 require("")
。
我原来的设置是这样的:
config.browserify_rails.commandline_options = ["-t [ babelify --presets [ es2015 react stage-0 ] --plugins [ syntax-async-functions transform-regenerator ] ]"]
这使得它跳过了包含这一行的文件:
var { configureStore } = require('./configureStore');
这里需要引导:
let { createStore, combineReducers, applyMiddleware, compose } = require('redux');
let thunk = require('redux-thunk').default
let session = require('./reducers/session').default;
let search = require('./reducers/search').default;
const configureStore = () => {
const reducers = combineReducers({
session,
search,
});
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
return createStore(
reducers,
composeEnhancers(applyMiddleware(thunk))
);
}
export { configureStore };
我猜我在这里使用的可能是一些 ES2015 之上的 JS 样式
所以我继续使用配置,添加增量,并更新到 ES2017。这让我超越了那个破损的文件。我的新配置如下所示:
config.browserify_rails.use_browserifyinc = true
config.browserify_rails.commandline_options = ["-t [ babelify --presets [ es2017 react stage-0 ] --plugins [ syntax-async-functions transform-regenerator ] ]", "-t coffeeify --extension=\".js.coffee\""]
但这让我在进一步的文件中看到了这一行:
let { search } = require('../../actions/search');
加载这个(请注意,下面的文件被解析和翻译得很好):
export const SEARCH_RESULTS_RECEIVED = 'SEARCH_RESULTS_RECEIVED';
export const search = (term, token) => {
return (dispatch) => {
if (term && term.trim() !== '') {
return _search(term, token).then((results) => dispatch(resultsReceived(results)));
} else {
return dispatch(resultsReceived([]));
}
}
};
const _search = (term, token) => {
let promise = new Promise((resolve, reject) => {
fetch(encodeURI(`/api/search?search=${term}`), {
headers: {
"Content-Type": "application/json",
"Authorization": `Token ${token}`
}
})
.then(response => response.json())
.then(function(response) {
return resolve(response.results);
})
.catch((error) => {
return reject(error);
});
});
return promise;
};
export const resultsReceived = (searchResults) => ({
type: SEARCH_RESULTS_RECEIVED,
searchResults
});
我很好奇是否有任何我可能缺少的 Babelify 插件/预设来完成这项工作。
最佳答案
年度预设仅包含当年添加的功能 - 即 es2017
不包括 es2015
中的任何内容和 es2016
预设!
这组预设应该可以解决您的问题:
es2015 es2016 es2017 react stage-0
也就是说,包含所有最新年度预设的首选方法是使用 env
preset ,其中包含所有这些,将在 ES2018 发布后更新,并且还允许您根据需要根据目标环境进行配置:
env react stage-0
关于javascript - 我缺少哪些 Babelify 预设/插件来解析这段代码?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44698272/